マイプロジェクトにテンプレートがコピーされます。

赤枠内のタイトルをクリックすると、設定画面に遷移します。
ステップ2 アプリトリガー「取引審査が完了したら」

プロセスの1番目をクリックします。ここではマネーフォワード 掛け払いとのアプリ連携と、取引審査が完了(イベント)を起点としたトリガーを設定していきます。
(1/1)連携アカウントとアクションを選択

以下はあらかじめ設定済みのため操作は不要です。
- タイトル
- データベースのアプリ
- 実行アクション
マネーフォワード 掛け払いと連携するアカウント情報は、設定が必要です。
プルダウンをクリックし、「+連携アカウントを追加」をクリック。こちらの画面がポップアップされます。

- アカウント名
- 任意の名称(メールアドレスなど)
- アクセストークン
- 事前準備で取得しておいたAPIキーをペースト
→追加を押下します。連携完了したら、次に進みましょう。
→次へをクリック
(1/2)アプリトリガーのWebhookイベント受信設定

表示されたWebhookURLをコピーします。WebhookURLを使うと、マネーフォワード 掛け払いの与信審査が完了した時点でYoomのフローボットが起動するため、リアルタイムな通知が可能になります。ここからは、マネーフォワード 掛け払いの管理画面を操作します。

マネーフォワード 掛け払いの左側にあるメニュー一覧からアカウント名をクリックすると、さらにメニューが表示されます。その中の、開発者向けにカーソルを合わせると、Webhookの項目が表示されます。こちらをクリックします。

Webhookの設定画面に遷移したら、右上にある新規エンドポイント追加ボタンをクリック!

URKに先ほどYoomの画面からコピーしたWebhookURLをペーストします。Secretは任意の値でOKです。イベントタイプの「取引審査」にチェックを入れます。
→追加するをクリック!
続いて、マネーフォワード 掛け払いのイベント(新規取引)を追加します。テストなので、今回は10円で設定しました。

Yoomの画面に戻ります。
→テストをクリック! →成功! アウトプットは次のオペレーションで使う値が含まれています。

※テスト結果がエラーの場合は、マネーフォワード 掛け払いのイベント(与信を通過した請求情報)がWebhookの設定後に起こっていないなどが考えられます。イベントの再設定後に再テストにお進みください。
→保存するをクリック
ステップ3 アプリと連携する「取引情報を取得」
プロセスの2番目をクリック!ここでは先ほどのアウトプットから取得した取引IDを使って、取引情報を抽出します。

(1/2)連携アカウントとアクションを選択

以下はあらかじめ設定済みのため操作は不要です。
- タイトル
- データベースのアプリ
- マネーフォワード 掛け払いと連携するアカウント情報
- 実行アクション
→次へをクリック
(1/2)API接続設定

- 取引ID
- 先ほど抽出したアウトプットを引用します

- Sandbox環境への切り替え
- 「Sandbox環境への切り替える」を選択してください。
→テストをクリック! →成功 アウトプットにはこちらの項目が抽出されました。

→保存するをクリック!
ステップ4 アプリと連携する「顧客情報を取得」
プロセスの3番目をクリック!ここでは先ほどのアウトプットから取得した顧客IDを使って、顧客情報を抽出します。

(1/2)連携アカウントとアクションを選択

以下はあらかじめ設定済みのため操作は不要です。
- タイトル
- データベースのアプリ
- マネーフォワード 掛け払いと連携するアカウント情報
- 実行アクション
→次へをクリック
(1/2)API接続設定

- 顧客ID
- 先ほど抽出したアウトプットを引用します

- Sandbox環境への切り替え
- 「Sandbox環境への切り替える」を選択してください。
→テストをクリック! →成功 アウトプットにはこちらの項目が抽出されました。

→保存するをクリック!
ステップ3 アプリと連携する「Slackに通知」
テンプレートの2番目のプロセスをクリックします。

(1/2)連携アカウントとアクションを選択

下記項目は初期設定済みです。任意で変更できますが、このまま進んでOKです。
- アプリトリガーのタイトル
- アプリ
- トリガーアクション
以下は設定が必要です。
- Slackと連携するアカウント情報
- プルダウンを開いて、+連携アカウントを追加をクリック。

- ワークスペースのURLを入力し、続行するをクリックします。

- YoomからSlackへアクセスの許可をリクエストする画面に移ります。
>ヘルプ:Slackのマイアプリ登録方法の詳細
>Slack公式:ワークスペースの管理
ワークスペースとの連携ができたら次に進みます。
→次へをクリック!
(2/2)API接続設定

次の項目の設定を進めます。

- 投稿先のチャンネルID
- 編集欄をクリックすると、先ほど連携したワークスペースのチャンネルがピックアップされます。この中から使用するチャンネルを選択。

- メッセージ
- 投稿するメッセージ内容を設定します。編集欄をクリックで、抽出したアウトプットを引用できます。今回は、小計がわかるように引用してみました。

→テストをクリック! →成功! アウトプットにはタイムスタンプが抽出されました。

→保存するをクリック!今回の設定はここまでです。
ステップ6 アプリトリガーを【ON】にする
全てのプロセスが設定済みになると、コンプリート画面がポップアップされます。

トリガーを【ON】にすると、設定完了です。

こちらで連携作業は完了です!Slackのチャンネルを見ると、投稿が確認できました。

<span class="mark-yellow">プログラミングを習得していない私でも、テンプレートの使用で短時間で自動化を実現できました。</span>今回のテンプレートはこちらです。