【Bubble】Backend Workflowsを使ったバッチ処理

概要

BubbleではBackend Workflowsの機能を使い、バッチ処理を実行できます。

バッチ処理とは、ひとまとまりのデータを一括処理する方法です。事前にバッチ処理する日時を定めることで、勤務時間外や深夜帯に効率よく処理できます。例えば、メーリングリストへの一斉送信、月次の売り上げデータの処理が挙げられます。

今回はBubbleのBackend Workflowを使い、5分後にメールを送信するバッチ処理を作成します。

ℹ️ Backend Workflowを利用するには、BubbleのPersonal plan以上の有料プラン登録が必要です。

完成イメージ

送信先メールアドレスを複数登録しておきます。本文内容を入力し「送信」ボタンを押すと、バッチ処理登録されます。

5分後にバッチ処理が実行され、メールが送信されました。

Backend Workflowsを使ったバッチ処理の実装方法

1. エレメントを配置する

Inputを1つ、Multiline Inputを1つ、Buttonを2つ配置します。

Inputにはメールアドレス、Multiline Inputにはメールの本文内容を入力します。

続いてRepeating Groupを配置し、その中にTextを配置します。

ここに送信先メールアドレスの一覧を表示します。

メールアドレス一覧を保存するために、Custom Stateを使います。

Repeating Groupのプロパティ上部のインフォメーションマークをクリックし、「Add a new custom state」を選択します。

「addressList」という、text typeでリスト形式のstateを作成します。

Repeating Groupのプロパティにて、Type of contentは「text」、Data sourceは「RepeatingGroup text’s addressList」とします。

Repeating Group内のTextには「Current cell’s text」を表示します。

これでaddressListのメールアドレス一覧を表示できるようになりました。

2. API workflowを作成する

続いてBackend workflowsのページにて、バッチ処理の内容であるAPI Workflowを作成します。

まずSettingsタブのAPIへ移動し「Enable Workflow API and backend workflows」にチェックを入れます。

チェックを入れると、ページ一覧の最下部に「Backend workflows」の項目が現れるので選択します。

この画面でバッチ処理の内容を設定します。基本的には、通常のWorkflow設定画面と似た操作です。

「New API workflow…」を選択し、API workflowを作成します。

プロパティを設定します。

API workflow nameには任意の名前を設定します。ここでは「send email」としました。

更にParameter definitionを設定します。「Add a new parameter」から新しく2つ追加します。

のちほどプレビューで送信ボタンをクリックした際に、このAPI workflowを呼び出し、addressとcontentのパラメータを渡せるようになります。

Key	Type	意味
address	text	送信先メールアドレス
content	text	Eメールの内容

続いてactionを追加します。

When	Step	意味
API workflow	Email > Send email	Eメールを送信する

To（送信先）に「address」、Body（メールの内容）に「content」を設定します。

これでバッチ処理の内容であるAPI workflowを作成できました。

3. Workflowを設定する

続いて2つのButtonのWorkflowを設定します。

まず「追加」ボタンです。これを押すと送信先メールアドレスが一覧へ追加されます。

エレメントを配置したページに戻り、追加ボタンのプロパティから「Start/Edit workflow」を押し、Workflowを作成します。

When	Step	意味
Button 追加 is clicked	Element Actions > Set state	Custom Stateの値を更新する（addressListに追加する）
	Element Actions > Reset relevant inputs	Inputの入力内容をリセットする

Step1のSet stateでは、Elementは「RepeatingGroup text」、Custom stateは「addressList」を選択します。

Valueには「RepeatingGroup text’s addressList:plus item Input メールアドレス’s value」と設定します。現在のaddressListに、Inputに入力したメールアドレスを追加する内容となっています。

Step2にて、Inputに入力した内容を空にしています。

以上で追加ボタンは実装完了です。

続いて「送信」ボタンです。これを押すと、先ほど作成したAPI workflowを呼び出し、メール送信処理をバッチ登録します。

エレメントを配置したページに戻り、送信ボタンのプロパティから「Start/Edit workflow」を押し、Workflowを作成します。

When	Step	意味
Button 送信 is clicked	Custom Events > Schedule API Workflow on a list	API Workflowの呼び出しをスケジューリングする
	Element Actions > Reset relevant inputs	Inputの入力内容をリセットする
	Element Actions > Set state	Custom Stateの値を更新する（addressListを空にする）

Step1にて、API Workflowを呼び出します。

Type of thingsは「text」、List to run on（処理対象のリスト）は「RepeatingGroup text’s addressList」です。

呼び出すAPI Workflowは「send email」（先ほど設定した、API Workflowの名前）です。

Scheduled dateは、今回はボタンを押した5分後とするので「Current date/time + (minutes):5」とします。

Intervalは、処理と処理との間隔です。今回は0秒としますが、1処理に時間がかかる場合は調整が必要です。

また、各パラメータに値を渡します。

addressには「This text」、contentには「MultilineInput 本文内容’s value」を設定します。