【Bubble】Backend Workflowsを使ったバッチ処理
概要
BubbleではBackend Workflowsの機能を使い、バッチ処理を実行できます。
バッチ処理とは、ひとまとまりのデータを一括処理する方法です。事前にバッチ処理する日時を定めることで、勤務時間外や深夜帯に効率よく処理できます。例えば、メーリングリストへの一斉送信、月次の売り上げデータの処理が挙げられます。
今回はBubbleのBackend Workflowを使い、5分後にメールを送信するバッチ処理を作成します。
ℹ️ Backend Workflowを利用するには、BubbleのPersonal plan以上の有料プラン登録が必要です。
完成イメージ
送信先メールアドレスを複数登録しておきます。本文内容を入力し「送信」ボタンを押すと、バッチ処理登録されます。
![](https://swooo.net/wp-content/uploads/2023/03/01スクリーンショット-2023-02-21-21.05.23.png)
5分後にバッチ処理が実行され、メールが送信されました。
![](https://swooo.net/wp-content/uploads/2023/03/02スクリーンショット-2023-02-21-21.23.11.png)
Backend Workflowsを使ったバッチ処理の実装方法
1. エレメントを配置する
Inputを1つ、Multiline Inputを1つ、Buttonを2つ配置します。
Inputにはメールアドレス、Multiline Inputにはメールの本文内容を入力します。
![](https://swooo.net/wp-content/uploads/2023/03/03スクリーンショット-2023-02-21-21.56.53.png)
続いてRepeating Groupを配置し、その中にTextを配置します。
ここに送信先メールアドレスの一覧を表示します。
メールアドレス一覧を保存するために、Custom Stateを使います。
Repeating Groupのプロパティ上部のインフォメーションマークをクリックし、「Add a new custom state」を選択します。
![](https://swooo.net/wp-content/uploads/2023/03/04スクリーンショット-2023-02-21-21.59.09.png)
「addressList」という、text typeでリスト形式のstateを作成します。
![](https://swooo.net/wp-content/uploads/2023/03/05スクリーンショット-2023-02-21-20.50.06.png)
Repeating Groupのプロパティにて、Type of contentは「text」、Data sourceは「RepeatingGroup text’s addressList」とします。
![](https://swooo.net/wp-content/uploads/2023/03/06スクリーンショット-2023-02-21-22.04.24.png)
Repeating Group内のTextには「Current cell’s text」を表示します。
これでaddressListのメールアドレス一覧を表示できるようになりました。
![](https://swooo.net/wp-content/uploads/2023/03/07スクリーンショット-2023-02-21-22.04.30.png)
2. API workflowを作成する
続いてBackend workflowsのページにて、バッチ処理の内容であるAPI Workflowを作成します。
まずSettingsタブのAPIへ移動し「Enable Workflow API and backend workflows」にチェックを入れます。
![](https://swooo.net/wp-content/uploads/2023/03/08スクリーンショット-2023-02-18-22.42.32-1024x587.png)
チェックを入れると、ページ一覧の最下部に「Backend workflows」の項目が現れるので選択します。
![](https://swooo.net/wp-content/uploads/2023/03/09スクリーンショット-2023-02-19-12.28.46.png)
この画面でバッチ処理の内容を設定します。基本的には、通常のWorkflow設定画面と似た操作です。
「New API workflow…」を選択し、API workflowを作成します。
![](https://swooo.net/wp-content/uploads/2023/03/10スクリーンショット-2023-02-19-12.27.43.png)
プロパティを設定します。
API workflow nameには任意の名前を設定します。ここでは「send email」としました。
更にParameter definitionを設定します。「Add a new parameter」から新しく2つ追加します。
のちほどプレビューで送信ボタンをクリックした際に、このAPI workflowを呼び出し、addressとcontentのパラメータを渡せるようになります。
Key | Type | 意味 |
---|---|---|
address | text | 送信先メールアドレス |
content | text | Eメールの内容 |
![](https://swooo.net/wp-content/uploads/2023/03/11スクリーンショット-2023-02-19-12.28.02.png)
続いてactionを追加します。
When | Step | 意味 |
---|---|---|
API workflow | Email > Send email | Eメールを送信する |
To(送信先)に「address」、Body(メールの内容)に「content」を設定します。
![](https://swooo.net/wp-content/uploads/2023/03/12スクリーンショット-2023-02-19-20.58.27.png)
これでバッチ処理の内容であるAPI workflowを作成できました。
3. Workflowを設定する
続いて2つのButtonのWorkflowを設定します。
まず「追加」ボタンです。これを押すと送信先メールアドレスが一覧へ追加されます。
エレメントを配置したページに戻り、追加ボタンのプロパティから「Start/Edit workflow」を押し、Workflowを作成します。
![](https://swooo.net/wp-content/uploads/2023/03/13スクリーンショット-2023-02-21-22.11.54.png)
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に入力したメールアドレスを追加する内容となっています。
![](https://swooo.net/wp-content/uploads/2023/03/14スクリーンショット-2023-02-21-22.12.19.png)
Step2にて、Inputに入力した内容を空にしています。
以上で追加ボタンは実装完了です。
続いて「送信」ボタンです。これを押すと、先ほど作成したAPI workflowを呼び出し、メール送信処理をバッチ登録します。
エレメントを配置したページに戻り、送信ボタンのプロパティから「Start/Edit workflow」を押し、Workflowを作成します。
![](https://swooo.net/wp-content/uploads/2023/03/15スクリーンショット-2023-02-21-22.10.49.png)
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」を設定します。
![](https://swooo.net/wp-content/uploads/2023/03/16スクリーンショット-2023-02-21-22.20.55.png)
Step3では、メールアドレス一覧を削除しています。
addressListを選択し、Valueを空にすることで値を削除できます。
![](https://swooo.net/wp-content/uploads/2023/03/17スクリーンショット-2023-02-21-22.21.02.png)
以上で実装が完了したので、プレビューで確認しましょう。
メールアドレスと本文内容を入力し、送信ボタンを押してください。5分後にメールが届いたら成功です。メールを送信するというバッチ処理を動作できました。