Cómo crear un paso

En esta guía, se explica cómo crear un paso que los usuarios pueden agregar a un flujo en Google Workspace Flows.

Un paso es un solo paso en la secuencia de tareas de un flujo. Los pasos no pueden iniciar un flujo.

Como ejemplo, considera un paso que realiza operaciones aritméticas. Le pide al usuario dos valores y una operación matemática. Luego, realiza la operación matemática en los valores y muestra el resultado.

Un usuario configura el paso de la calculadora como parte de un flujo.

Figura 1: Un usuario configura el paso de la calculadora como parte de un flujo.

Para compilar un paso, configúralo en el archivo de manifiesto del complemento, escribe la lógica de la aplicación en el código del complemento de Google Workspace y, luego, implementa y prueba el paso. Durante la versión alfa, no publiques un complemento que extienda Flows.

Define el paso

Para configurar un paso, defínelo en el archivo de manifiesto y escribe su lógica de aplicación en el código.

Cómo definir el paso en el archivo de manifiesto

En el archivo de manifiesto, appsscript.json:

  1. Establece onConfigFunction y onExecuteFunction en los nombres de las funciones correspondientes en el código del complemento. En este ejemplo, las funciones se llaman onConfigCalculate() y onExecuteCalculate().
    • onConfigFunction configura el paso. Si es necesario, recopila los datos de los usuarios necesarios para ejecutar el paso, como la dirección a la que se debe enviar un correo electrónico. En el ejemplo de esta guía, solicitamos dos valores y una operación matemática.
    • onExecuteFunction ejecuta el paso. Si se recopilaron datos de los usuarios, esos datos se pasan a esta función. Si corresponde, devuelve un resultado. En el ejemplo de esta guía, se muestra el resultado de un cálculo matemático.

  2. Establece las entradas y salidas requeridas, lo que permite que el paso recopile datos y los envíe a pasos posteriores. En este ejemplo, se le pide al usuario dos valores y una operación matemática definida en inputs[]. Genera el resultado calculado como se define en outputs[].

    Para obtener más información sobre las entradas y salidas, consulta Variables de entrada y Variables de salida. Para asegurarte de que los flujos se ejecuten sin errores, valida las variables de entrada.

Este es el archivo de manifiesto para el paso de la calculadora:

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": "actionElement",
          "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"
          }
        }
      ]
    }
  }
}

A continuación, define el paso en el código para escribir el código de asistencia.

Cómo definir el paso en el código

En el código de la aplicación, haz lo siguiente:

  1. Escribe el onConfigFunction, llamado onConfigCalculate() en este ejemplo. Cuando los usuarios agregan el paso a un flujo, pueden configurar aspectos del paso en el compilador de flujos. Para recopilar la información requerida del usuario, onConfigFunction define una tarjeta de configuración.

    Las tarjetas son los componentes básicos de las interfaces de usuario en los complementos. Las tarjetas admiten un diseño definido, elementos interactivos de la IU, como botones, y contenido multimedia enriquecido, como imágenes. Las tarjetas son la forma en que puedes obtener datos de un usuario que el paso necesita para ejecutarse, como una dirección de correo electrónico para enviar un mensaje.

    El método OnConfigFunction devuelve un objeto RenderActions que contiene una tarjeta. Esta tarjeta define la IU en la que los usuarios configuran los datos del paso. En este ejemplo, onConfigFunction crea una tarjeta que le solicita al usuario dos valores y una operación matemática.

  2. Escribe el onExecuteFunction llamado onExecuteCalculate() en este ejemplo. Cuando se ejecuta tu paso en un flujo, se ejecuta OnExecuteFunction. Cualquier valor de entrada que el usuario haya establecido durante la configuración, según se define en onConfigurationFunction, se pasa a OnExecuteFunction.

    Escribe OnExecuteFunction() de modo que ejecute su tarea de forma síncrona con las entradas proporcionadas. Recuerda que OnExecuteFunction() debe devolver todos los resultados definidos en el manifiesto de tu flujo. De lo contrario, se producirá un error.

Esta muestra de código incluye una función de asistencia, outputVariables(), que construye y envía las variables proporcionadas como resultado del paso.

Tu paso está listo para la prueba.

Este es el código del paso de la calculadora:

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 card also includes a "Save"
 * button to save the step configuration for the workflow.
 *
 * The input fields are configured to let the user select outputs from previous
 * workflow steps as input values using the `hostAppDataSource` property.
 */
function onConfigCalculate() {
  var card = {
    "sections": [
      {
        "header": "Step example: Calculate",
        "widgets": [
          {
            "textInput": {
              "name": "value1",
              "label": "First value",
              "hostAppDataSource" : {
                "workflowDataSource" : {
                  "includeVariables" : true
                }
              }
            }
          },
          {
            "selectionInput": {
              "name": "operation",
              "label": "Operation",
              "type": "DROPDOWN",
              "items": [
                {
                  "text": "+",
                  "value": "+",
                },
                {
                  "text": "-",
                  "value": "-",
                },
                {
                  "text": "x",
                  "value": "x",
                },
                {
                  "text": "/",
                  "value": "/",
                }
              ]
            }
          },
          {
            "textInput": {
              "name": "value2",
              "label": "Second value",
              "hostAppDataSource" : {
                "workflowDataSource" : {
                  "includeVariables" : true
                }
              }
            }
          }
        ]
      }
    ]
  };
  return {
    "action": {
      "navigations": [{
        "push_card": 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(variableValues) {
  var renderAction =  {
    "hostAppAction" : {
      "workflowAction" : {
        "returnOutputVariablesAction" : {
          "variables" : variableValues
        }
      }
    }
  };
  console.log("renderAction: " + JSON.stringify(renderAction));
  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;
  }
  return outputVariables([{
    "variableId": "result",
    "variableData": {
        "integerValues": [
          calculatedValue
        ]
      },
  }]);
}

Prueba tu paso

Para probar tu paso, configura una implementación de prueba para tu complemento, agrega el paso a un flujo y, luego, ejecuta el flujo.

  1. Configura una implementación de prueba para tu complemento:

    1. Abre el proyecto de secuencia de comandos en el editor de Apps Script.
    2. Haz clic en Implementar > Implementaciones de prueba.
    3. Haz clic en Install.
    4. En la parte inferior, haz clic en Listo.

    Puedes permitir que otros usuarios prueben el complemento compartiendo el proyecto de Apps Script con su cuenta (se requiere acceso de edición). Luego, indícales a los usuarios que sigan los pasos anteriores.

    Una vez instalado, el complemento estará disponible de inmediato en Flows. Es posible que debas actualizar Flows antes de que aparezca el complemento. También debes autorizar el complemento antes de usarlo.

    Para obtener más información sobre las implementaciones de prueba, consulta Cómo instalar un complemento no publicado.

  2. Abre Flows.

  3. Crea un flujo que incluya tu paso:

    1. Haz clic en Nuevo flujo.
    2. Selecciona cómo se inicia el flujo. Cuando pruebes un paso, es una buena idea elegir un activador que puedas iniciar tú mismo, como enviarte un correo electrónico. Si tu paso requiere una variable de entrada, configúrala como parte de la salida del iniciador.
    3. Haz clic en Agregar paso. Selecciona el paso que creaste o actualizaste, llamado Calcular.
    4. Configura el paso. Para el paso de cálculo, elige dos valores y una operación matemática. El paso se guarda automáticamente.
    5. Para probar el resultado de tu paso, agrega otro paso. Por ejemplo, para agregar un resultado a un mensaje de correo electrónico, puedes agregar el paso Enviar un mensaje de Gmail. En Mensaje, haz clic en Variables y selecciona el resultado del paso. Para el paso de cálculo, selecciona Variables > Paso 2: Resultado calculado > Resultado calculado. La variable aparece como un chip en el campo Mensaje.
    6. Haz clic en Activar. El flujo ya se puede ejecutar.

  4. Ejecuta el flujo activando su disparador. Por ejemplo, si tu flujo comienza cuando recibes un correo electrónico, envíate uno.

  5. Verifica que el flujo se ejecute según lo esperado. Para verificar los registros, visita la pestaña Actividad del compilador de flujos. Para obtener información sobre cómo crear registros personalizados en la pestaña Actividad, consulta Registros de actividad.