Schritt erstellen

In dieser Anleitung wird beschrieben, wie Sie einen Schritt erstellen, den Nutzer einem Flow in Google Workspace Studio hinzufügen können.

Ein Schritt ist ein einzelner Schritt in der Aufgabenfolge eines Flows. Schritte können keinen Flow starten.

Nehmen wir als Beispiel einen Schritt, bei dem eine Rechenoperation ausgeführt wird. Der Nutzer wird nach zwei Werten und einer Rechenoperation gefragt. Anschließend wird die Rechenoperation auf die Werte angewendet und das Ergebnis ausgegeben.

Die Karte für den Workspace Studio-Rechnerschritt mit zwei Eingabefeldern für Zahlen und einem Drop-down-Menü für arithmetische Operationen.
Abbildung 1: Ein Nutzer konfiguriert den Schritt „Rechner“ als Teil eines Flows.

Um einen Schritt zu erstellen, konfigurieren Sie ihn in der Manifestdatei des Add‑ons, schreiben Sie die Anwendungslogik im Code des Google Workspace-Add‑ons und stellen Sie den Schritt bereit und testen Sie ihn.

Schritt definieren

Um einen Schritt zu konfigurieren, definieren Sie ihn in der Manifestdatei und schreiben Sie die Anwendungslogik im Code.

Schritt in der Manifestdatei definieren

In der Manifestdatei appsscript.json:

  1. Legen Sie für onConfigFunction und onExecuteFunction die Namen der entsprechenden Funktionen im Code des Add‑ons fest. In diesem Beispiel heißen die Funktionen onConfigCalculate und onExecuteCalculate.
    • onConfigFunction richtet den Schritt ein und konfiguriert ihn. Bei Bedarf werden Daten von Nutzern erfasst, die für die Ausführung des Schritts erforderlich sind, z. B. die Adresse, an die eine E‑Mail gesendet werden soll. Geben Sie im Beispiel dieser Anleitung zwei Werte und eine Rechenoperation an.
    • onExecuteFunction führt den Schritt aus. Wenn Daten von Nutzern erfasst wurden, werden sie an diese Funktion übergeben. Gibt gegebenenfalls eine Ausgabe zurück. In diesem Beispiel wird das Ergebnis einer Rechenoperation zurückgegeben.
  2. Legen Sie die erforderlichen Eingaben und Ausgaben fest, damit der Schritt Daten erfassen und an spätere Schritte senden kann. In diesem Beispiel werden die Nutzer nach zwei Werten und einer Rechenoperation gefragt, die in inputs[] definiert sind. Geben Sie das berechnete Ergebnis aus, wie in outputs[] definiert.

    Weitere Informationen zu Eingaben und Ausgaben finden Sie unter Eingabevariablen und Ausgabevariablen. Um sicherzustellen, dass Flows fehlerfrei ausgeführt werden, validieren Sie die Eingabevariablen.

Hier ist die Manifestdatei für den Schritt „Rechner“:

JSON

{
  "timeZone": "America/Los_Angeles",
  "exceptionLogging": "STACKDRIVER",
  "runtimeVersion": "V8",
  "addOns": {
    "common": {
      "name": "Calculator",
      "logoUrl": "https://www.gstatic.com/images/branding/productlogos/calculator_search/v1/web-24dp/logo_calculator_search_color_1x_web_24dp.png",
      "useLocaleFromApp": true
    },
    "flows": {
      "workflowElements": [
        {
          "id": "calculatorDemo",
          "state": "ACTIVE",
          "name": "Calculate",
          "description": "Asks the user for two values and a math operation, then performs the math operation on the values and outputs the result.",
          "workflowAction": {
            "inputs": [
              {
                "id": "value1",
                "description": "value1",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "INTEGER"
                }
              },
              {
                "id": "value2",
                "description": "value2",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "INTEGER"
                }
              },
              {
                "id": "operation",
                "description": "operation",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "STRING"
                }
              }
            ],
            "outputs": [
              {
                "id": "result",
                "description": "Calculated result",
                "cardinality": "SINGLE",
                "dataType": {
                  "basicType": "INTEGER"
                }
              }
            ],
            "onConfigFunction": "onConfigCalculate",
            "onExecuteFunction": "onExecuteCalculate"
          }
        }
      ]
    }
  }
}

Schreiben Sie als Nächstes den unterstützenden Code, indem Sie den Schritt im Code definieren.

Schritt im Code definieren

Gehen Sie im Anwendungscode so vor:

  1. Schreiben Sie die onConfigFunction, die in diesem Beispiel onConfigCalculate heißt. Wenn Nutzer den Schritt einem Flow hinzufügen, können sie Aspekte des Schritts im Flow-Builder konfigurieren. Um die erforderlichen Informationen vom Nutzer zu erfassen, definiert die onConfigFunction eine Konfigurationskarte.

    Karten sind die Bausteine für Benutzeroberflächen in Add‑ons. Karten unterstützen ein definiertes Layout, interaktive UI-Elemente wie Schaltflächen und Rich Media wie Bilder. Über Karten können Sie Daten von einem Nutzer abrufen, die für die Ausführung des Schritts erforderlich sind, z. B. eine E‑Mail-Adresse zum Senden einer E‑Mail.

    Die onConfigFunction gibt eine Karte zurück. Auf dieser Karte wird die Benutzeroberfläche definiert, auf der Nutzer die Daten des Schritts festlegen. In diesem Beispiel erstellt die onConfigFunction eine Karte, auf der der Nutzer nach zwei Werten und einer Rechenoperation gefragt wird.

  2. Schreiben Sie die onExecuteFunction, die in diesem Beispiel onExecuteCalculate heißt. Wenn Ihr Schritt in einem Flow ausgeführt wird, wird die onExecuteFunction ausgeführt. Alle Eingabewerte, die der Nutzer während der Konfiguration festgelegt hat, wie in der onConfigFunction definiert, werden an onExecuteFunction übergeben.

    Schreiben Sie onExecuteFunction so, dass die Aufgabe mit den angegebenen Eingaben synchron ausgeführt wird. Die onExecuteFunction muss alle in der Manifestdatei Ihres Flows definierten Ausgaben zurückgeben, andernfalls tritt ein Fehler auf.

Dieses Codebeispiel enthält eine unterstützende Funktion, outputVariables, die die angegebenen Variablen als Ausgabe des Schritts erstellt und sendet.

Ihr Schritt ist bereit zum Testen.

Hier ist der Code für den Schritt „Rechner“:

Apps Script

/**
 * Generates and displays a configuration card for the sample calculation step.
 *
 * This function creates a card with input fields for two values and a drop-down
 * for selecting an arithmetic operation.
 *
 * The input fields are configured to let the user select outputs from previous
 * steps as input values using the `hostAppDataSource` property.
 */
function onConfigCalculate() {
  const firstInput = CardService.newTextInput()
  .setFieldName("value1")
  .setTitle("First Value")
  .setHostAppDataSource(
    CardService.newHostAppDataSource()
      .setWorkflowDataSource(
        CardService.newWorkflowDataSource()
          .setIncludeVariables(true)
      )
  );
  const secondInput = CardService.newTextInput()
    .setFieldName("value2")
    .setTitle("Second Value").setHostAppDataSource(
      CardService.newHostAppDataSource()
        .setWorkflowDataSource(
          CardService.newWorkflowDataSource()
            .setIncludeVariables(true)
        )
    );
  const selectionInput = CardService.newSelectionInput()
    .setTitle("operation")
    .setFieldName("operation")
    .setType(CardService.SelectionInputType.DROPDOWN)
    .addItem("+", "+", false)
    .addItem("-", "-", true)
    .addItem("x", "x", false)
    .addItem("/", "/", false);

  const sections = CardService.newCardSection()
    .setHeader("Action_sample: Calculate")
    .setId("section_1")
    .addWidget(firstInput)
    .addWidget(selectionInput)
    .addWidget(secondInput)

  var card = CardService.newCardBuilder()
    .addSection(sections)
    .build();

  return card;
}

/**
* Returns output variables from a step.
*
* This function constructs an object that, when returned, sends the
* provided variable values as output from the current step.
* The variable values are logged to the console for debugging purposes.
*/
function outputVariables(variableDataMap) {
const workflowAction = AddOnsResponseService.newReturnOutputVariablesAction()
  .setVariableDataMap(variableDataMap);

const hostAppAction = AddOnsResponseService.newHostAppAction()
  .setWorkflowAction(workflowAction);

const renderAction = AddOnsResponseService.newRenderActionBuilder()
  .setHostAppAction(hostAppAction)
  .build();

return renderAction;
}

/**
 * Executes the calculation step based on the inputs from a flow event.
 *
 * This function retrieves input values and the operation from the flow event,
 * performs the calculation, and returns the result as an output variable.
 * The function logs the event for debugging purposes.
 */
function onExecuteCalculate(event) {
  console.log("output: " + JSON.stringify(event));
  var calculatedValue = 0;
  var value1 = event.workflow.actionInvocation.inputs["value1"].integerValues[0];
  var value2 = event.workflow.actionInvocation.inputs["value2"].integerValues[0];
  var operation = event.workflow.actionInvocation.inputs["operation"].stringValues[0];

  if (operation == "+") {
    calculatedValue = value1 + value2;
  } else if (operation == "-") {
    calculatedValue = value1 - value2;
  } else if (operation == "x") {
    calculatedValue = value1 * value2;
  } else if (operation == "/") {
    calculatedValue = value1 / value2;
  }

  const variableDataMap = { "result": AddOnsResponseService.newVariableData().addIntegerValue(calculatedValue) };

  return outputVariables(variableDataMap);
}

Schritt testen

Um Ihren Schritt zu testen, richten Sie eine Testbereitstellung für Ihr Add‑on ein, fügen Sie den Schritt einem Flow hinzu und führen Sie den Flow aus.

  1. Testbereitstellung für Ihr Add‑on einrichten:

    1. Öffnen Sie das Skriptprojekt im Apps Script-Editor.
    2. Klicken Sie auf Bereitstellen > Testbereitstellungen.
    3. Klicken Sie auf Installieren.
    4. Klicken Sie unten auf Fertig.

    Sie können andere Nutzer das Add‑on testen lassen, indem Sie das Apps Script-Projekt für ihr Konto freigeben (Bearbeitungszugriff erforderlich). Fordern Sie die Nutzer dann auf, die vorherigen Schritte auszuführen.

    Nach der Installation ist das Add‑on sofort in Flows verfügbar. Möglicherweise müssen Sie Flows aktualisieren, bevor das Add‑on angezeigt wird. Sie müssen das Add‑on auch autorisieren, bevor Sie es verwenden können.

    Weitere Informationen zu Testbereitstellungen finden Sie unter Nicht veröffentlichtes Add‑on installieren.

  2. Öffnen Sie Flows.

  3. Erstellen Sie einen Flow, der Ihren Schritt enthält:

    1. Klicken Sie auf „Hinzufügen“ Neuer Flow.
    2. Wählen Sie aus, wie der Flow gestartet werden soll. Wenn Sie einen Schritt testen, empfiehlt es sich, einen Auslöser zu wählen, den Sie selbst auslösen können, z. B. indem Sie sich eine E‑Mail senden. Wenn für Ihren Schritt eine Eingabevariable erforderlich ist, konfigurieren Sie sie als Teil der Ausgabe des Auslösers.
    3. Klicken Sie auf „Hinzufügen“ Schritt hinzufügen. Wählen Sie den Schritt aus, den Sie erstellt oder aktualisiert haben, und nennen Sie ihn Berechnen.
    4. Konfigurieren Sie den Schritt. Wählen Sie für den Schritt „Berechnen“ zwei Werte und eine Rechenoperation aus. Der Schritt wird automatisch gespeichert.
    5. Wenn Sie die Ausgabe Ihres Schritts testen möchten, fügen Sie einen weiteren Schritt hinzu. Wenn Sie beispielsweise eine E‑Mail-Nachricht ausgeben möchten, fügen Sie den Schritt Nachricht senden von Gmail hinzu. Klicken Sie unter Nachricht auf „Hinzufügen“ Variablen und wählen Sie die Ausgabe Ihres Schritts aus. Wählen Sie für den Schritt „Berechnen“ Variablen > Schritt 2: Berechnetes Ergebnis > Berechnetes Ergebnis aus. Die Variable wird als Chip im Feld Nachricht angezeigt.
    6. Klicken Sie auf Aktivieren. Der Flow kann jetzt ausgeführt werden.
  4. Führen Sie den Flow aus, indem Sie den Auslöser des Flows auslösen. Wenn Ihr Flow beispielsweise beim Empfang einer E‑Mail gestartet wird, senden Sie sich selbst eine E‑Mail.

  5. Prüfen Sie, ob der Flow wie erwartet ausgeführt wird. Prüfen Sie die Logs auf dem Tab Aktivität des Flow-Builders. Informationen zum Erstellen benutzerdefinierter Logs auf dem Tab „Aktivität“ finden Sie unter Aktivitätslogs.