Buat langkah

Panduan ini menjelaskan cara membuat langkah yang dapat ditambahkan pengguna ke alur di Google Workspace Studio.

Langkah adalah satu langkah dalam urutan tugas alur. Langkah tidak dapat memulai alur.

Sebagai contoh, pertimbangkan langkah yang melakukan perhitungan aritmatika. Langkah tersebut meminta pengguna untuk memasukkan dua nilai dan operasi matematika. Kemudian, langkah tersebut melakukan operasi matematika pada nilai dan menampilkan hasilnya.

Pengguna mengonfigurasi langkah kalkulator sebagai bagian dari alur.

Gambar 1: Pengguna mengonfigurasi langkah kalkulator sebagai bagian dari alur.

Untuk membuat langkah, konfigurasikan langkah tersebut dalam file manifes add-on, tulis logika aplikasi dalam kode add-on Google Workspace, lalu deploy dan uji langkah tersebut.

Menentukan langkah

Untuk mengonfigurasi langkah, tentukan langkah tersebut dalam file manifes dan tulis logika aplikasinya dalam kode.

Menentukan langkah dalam file manifes

Dalam file manifes, appsscript.json:

  1. Tetapkan onConfigFunction dan onExecuteFunction ke nama fungsi yang sesuai dalam kode add-on. Dalam contoh ini, fungsi tersebut disebut onConfigCalculate() dan onExecuteCalculate().
    • onConfigFunction menyiapkan dan mengonfigurasi langkah. Jika perlu, kumpulkan data dari pengguna yang diperlukan untuk menjalankan langkah, seperti alamat untuk mengirim email. Dalam contoh panduan ini, kami meminta dua nilai dan operasi matematika.
    • onExecuteFunction menjalankan langkah. Jika data dikumpulkan dari pengguna, data tersebut akan diteruskan ke fungsi ini. Jika berlaku, tampilkan output. Dalam contoh panduan ini, tampilkan hasil perhitungan matematika.
  2. Tetapkan input dan output yang diperlukan, yang memungkinkan langkah mengumpulkan data dan mengirimkannya ke langkah berikutnya. Dalam contoh ini, minta pengguna untuk memasukkan dua nilai dan operasi matematika yang ditentukan dalam inputs[]. Tampilkan hasil perhitungan seperti yang ditentukan dalam outputs[].

    Untuk mempelajari input dan output lebih lanjut, lihat Variabel input dan Variabel output. Untuk memastikan alur berjalan tanpa error, validasi variabel input.

Berikut adalah file manifes untuk langkah Kalkulator:

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"
          }
        }
      ]
    }
  }
}

Selanjutnya, tulis kode pendukung dengan menentukan langkah dalam kode.

Menentukan langkah dalam kode

Dalam kode aplikasi, lakukan hal berikut:

  1. Tulis onConfigFunction, yang disebut onConfigCalculate() dalam contoh ini. Saat menambahkan langkah ke alur, pengguna dapat mengonfigurasi aspek langkah di pembuat alur. Untuk mengumpulkan info yang diperlukan dari pengguna, onConfigFunction menentukan kartu konfigurasi.

    Kartu adalah elemen penyusun untuk antarmuka pengguna di add-on. Kartu mendukung tata letak yang ditentukan, elemen UI interaktif seperti tombol, dan media kaya seperti gambar. Kartu adalah cara Anda mendapatkan data dari pengguna yang diperlukan langkah untuk dijalankan, seperti alamat email untuk mengirim email.

    OnConfigFunction menampilkan kartu. Kartu ini menentukan UI tempat pengguna menetapkan data langkah. Dalam contoh ini, onConfigFunction membuat kartu yang meminta pengguna untuk memasukkan dua nilai dan operasi matematika.

  2. Tulis onExecuteFunction yang disebut onExecuteCalculate() dalam contoh ini. Saat langkah Anda berjalan dalam alur, OnExecuteFunction akan berjalan. Setiap nilai input yang ditetapkan pengguna selama konfigurasi seperti yang ditentukan dalam onConfigurationFunction akan diteruskan ke OnExecuteFunction.

    Tulis OnExecuteFunction() sehingga tugasnya dijalankan secara sinkron menggunakan input yang diberikan. Ingat, OnExecuteFunction() harus menampilkan semua output yang ditentukan dalam manifes alur Anda. Jika tidak, error akan terjadi.

Contoh kode ini menyertakan fungsi pendukung, outputVariables(), yang membuat dan mengirim variabel yang diberikan sebagai output dari langkah.

Langkah Anda siap diuji.

Berikut adalah kode untuk langkah Kalkulator:

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);
}

Menguji langkah

Untuk menguji langkah, siapkan deployment pengujian untuk add-on Anda, tambahkan langkah ke alur, lalu jalankan alur.

  1. Siapkan deployment pengujian untuk add-on Anda:

    1. Buka project skrip di editor Apps Script.
    2. Klik Deploy > Test deployments.
    3. Klik Install.
    4. Di bagian bawah, klik Done.

    Anda dapat mengizinkan pengguna lain menguji add-on dengan membagikan project Apps Script ke akun mereka (akses edit diperlukan). Kemudian, minta pengguna untuk mengikuti langkah-langkah sebelumnya.

    Setelah diinstal, add-on akan langsung tersedia di Alur. Anda mungkin perlu memuat ulang Alur sebelum add-on muncul. Anda juga harus mengotorisasi add-on sebelum menggunakannya.

    Untuk mempelajari deployment pengujian lebih lanjut, lihat Menginstal add-on yang belum dipublikasikan.

  2. Buka Alur.

  3. Buat alur yang menyertakan langkah Anda:

    1. Klik Alur baru.
    2. Pilih cara alur dimulai. Saat menguji langkah, sebaiknya pilih starter yang dapat Anda aktifkan sendiri, seperti mengirim email kepada diri Anda sendiri. Jika langkah Anda memerlukan variabel input, konfigurasikan variabel input sebagai bagian dari output starter.
    3. Klik Tambahkan langkah. Pilih langkah yang Anda buat atau perbarui, yang disebut Hitung.
    4. Konfigurasikan langkah Anda. Untuk langkah hitung, pilih dua nilai dan operasi matematika. Langkah akan disimpan secara otomatis.
    5. Untuk menguji output langkah Anda, tambahkan langkah lain. Misalnya, untuk menambahkan output ke pesan email, Anda dapat menambahkan langkah Kirim pesan Gmail. Di Pesan, klik Variabel dan pilih output langkah Anda. Untuk langkah hitung, pilih Variabel > Langkah 2: Hasil perhitungan > Hasil perhitungan. Variabel akan muncul sebagai chip di kolom Pesan.
    6. Klik Aktifkan. Alur Anda siap dijalankan.
  4. Jalankan alur dengan mengaktifkan starter alur Anda. Misalnya, jika alur Anda dimulai saat Anda menerima email, kirim email kepada diri Anda sendiri.

  5. Verifikasi bahwa alur berjalan seperti yang diharapkan. Periksa log dengan membuka tab Aktivitas pembuat alur. Untuk mempelajari cara membuat log kustom di tab Aktivitas, lihat Log aktivitas.