【30分外部連携】シリーズでは、弊社が提供するローコードプラットフォーム「SPIRAL ver.1」や「SPIRAL ver.2」を使い、わずか30分程度で作成した外部アプリと連携するシステムをご紹介していきます！
SlackやTeamsなど、日常業務で多くの方が利用しているツールと連携した便利な機能を中心に取り上げていきますので、
「この機能、自分の会社ならこんなふうに使えそう！」などといった視点で、ぜひ楽しみながらご覧ください！
はじめに
こんにちは、スパイラル株式会社でインターンをしている学生です！
SPIRALでお問い合わせフォームを作ったけれど、
・新しいお問い合わせが届いたのに気づかなかった、
・対応が遅れてしまうかも、
と不安に感じたこと・心配はありませんか？
そこで今回は、**SPIRALのフォームに登録されたデータのうち「未対応のものがあればSlackに自動通知する仕組み」**を実際に構築してみました。
「とりあえず最短で動く形が知りたい」という人向けに、私が実際に試して成功した手順をまとめます。
この記事でやること
- SPIRAL側に**「未対応・対応中・対応済」のステータス**（セレクトタイプフィールド）を準備
- 定期的にステータスを確認し、**「未対応」**のデータがあればWebhookを発行
- Slackチャンネルに通知が送信される
動作確認は「フォームにダミーデータを登録 → Slackに通知が届く」で行います。
Slack通知のイメージはこちらです↓
前準備
構築に必要なのは次の2つです。
-
SPIRAL環境
- フォームとデータベースを作成できる権限
- 「アカウント管理」→「APIエージェント」の利用
-
SlackのIncoming Webhook URL
- 通知先のチャンネルを指定してWebhookを作成
URLが発行されるので、これをSPIRALに設定します
- 通知先のチャンネルを指定してWebhookを作成
実装手順
1. SLACKでIncoming Webhookを取得
SPIRALナレッジサイトの定期的に Slack へ通知するサンプルプログラム ページ、「1.SLACK側の設定」を参照して、Incoming Webhookを取得します。
紹介されている手順に従って、Webhook URLを控えておいてください※１。
2. SPIRALのDBにセレクトタイプフィールドを用意
今回使用した「お問い合わせDB」のフィールドは上図の通りです。「名前」「メールアドレス」など最低限の項目でOKですが、「セレクト」タイプフィールドは必ず設定してください。
セレクトタイプフィールドのステータスを上図のように設定しました。
「未対応」項目に対応するID番号は「０」となっていますが、この値を後の設定で使用するので控えておいてください※２。
「デフォルト値」は「未対応」で固定します。
3. SPIRALでAPIキーを発行
「アカウント管理」をクリックします。
以下のようにパスワードの確認を求められるので、入力してください。
「APIエージェント」をクリックします。
「＋」ボタンをクリックして、APIエージェントを作成します。
作成したAPIエージェント(本記事ではSlack連携)をクリックします。
「作成」ボタンをクリックしてAPIキーを作成します。
表示されたAPIキーを控えておいてください※３。
APIキーの発行について、詳しくは(ナレッジサイト)[https://knowledge.spirers.jp/article/design/detail/6912]をご確認ください。
4. SPIRALでスケジュールトリガ→アクションを作成
続いてスケジュールトリガの設定です。
今回はPHP実行アクションを使用して、SLACKに通知を送信します。
具体的な設定手順はこちらがわかりやすいです。
必須項目の「表示名」を入力、「ステータス」を選択して、PHPを編集します。
今回はナレッジサイトに掲載されている以下のコードを使用しました。
<?php
// スパイラル設定値
define("API_URL", "https://api.spiral-platform.com/v1");
define("API_KEY", "APIキー");
define("APP_ROLE", "アプリロール識別名");
define("APP_ID", "アプリID");
define("DB_ID", "DBID");
define("STATUS_FIELD", "フィールド識別名"); // 未対応・対応済などを管理するセレクトタイプフィールドの識別名
define("BACKLOG_STATUS_ID", "0"); // 上記セレクトタイプフィールドの「未対応」項目のID番号
define("CONTACT_TITLE", "問い合わせタイトル識別名"); // 通知に記載する問い合わせ件名
// slack設定値
define("SLACK_WEBHOOK_URL", "SLACKのWebhookURL");
// 月曜日から金曜日のみ実行
$weekday = date('w');
if($weekday >= 1 && $weekday <= 5){
// 「未対応」のお問い合わせリストを取得
$apikey = API_KEY;
$spiralApiUrl = API_URL."/apps/".APP_ID."/dbs/".DB_ID."/records?where=@".STATUS_FIELD."=".BACKLOG_STATUS_ID."&enableTotalCount=true&sort=_id:asc";
$result = SPIRAL_API_send($spiralApiUrl);
$backlogs = $result["items"];
$totalCount = $result["totalCount"];
// 「未対応」が1件でもあったらslackへ通知
if($totalCount){
// 通知メッセージを作成
$message = array();
$message[] = "未対応の問い合わせが".$totalCount."件あります。（最大10件表示）"."\n";
// 最大10件の問い合わせを通知
for($i = 0; $i < 10 && $i < $totalCount; $i++){
// 投稿日時のタイムゾーンを日本時間に変更
$_createdAtDateTime = new DateTime(date('Y-m-d H:i', strtotime($backlogs[$i]["_createdAt"])), new DateTimeZone('Asia/Tokyo'));
$_createdAt = $_createdAtDateTime->format('Y-m-d H:i');
// ID.問い合わせ件名（投稿日時：20XX-XX-XX XX:XX）
array_push($message, $backlogs[$i]["_id"].".".$backlogs[$i][CONTACT_TITLE]."（投稿日時：".$_createdAt."）\n");
}
$url = "https://XXXXXXXXX.spiral-platform.com/user-area/apps/".APP_ID."/dbs/".DB_ID."/records?role=xxxx";
$messageTxt = <<<EOF
内容を確認して対応をお願いします。
アプリ利用画面URL（表示権限があるユーザでSPIRAL ver.2 にログインしている時のみアクセスできます。）
$url
EOF;
array_push($message, $messageTxt);
$data = array();
$data["text"] = implode($message);
// slackへ通知
SLACK_WEBHOOK_send($data);
}
}
function SPIRAL_API_send( $spiralApiUrl){
$header = array(
"Authorization:Bearer ".API_KEY,
"Content-Type:application/json",
"X-Spiral-Api-Version: 1.1",
);
if(APP_ROLE){
$header = array_merge($header,array("X-Spiral-App-Role: ".APP_ROLE));
}
// curl
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_URL, $spiralApiUrl);
curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
$response = curl_exec($curl);
if (curl_errno($curl)) echo curl_error($curl);
curl_close($curl);
return json_decode($response, true);
}
function SLACK_WEBHOOK_send($data){
$header = array(
"Content-Type:application/json",
);
// curl
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_URL, SLACK_WEBHOOK_URL);
curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
curl_setopt($curl, CURLOPT_POSTFIELDS, json_encode($data));
curl_setopt($curl, CURLOPT_CUSTOMREQUEST, "POST");
$response = curl_exec($curl);
if (curl_errno($curl)) echo curl_error($curl);
curl_close($curl);
return json_decode($response, true);
}
// スパイラル設定値
// slack設定値
の箇所は以下のように編集する必要があります。
慣れない操作だったので、ここで少し躓きました！
詳しくはコードの掲載元(ナレッジサイトをご覧ください。
・API_URL…固定値なので変更なし
・API_KEY …※３で取得したAPIキー
・APP_ROLE …設定したアプリロールの識別名。今回は全権限で作成したため空にしました。
・APP_ID …使用するアプリのID（下図の赤枠部）
・DB_ID …使用するDBのID （下図の赤枠部）
・STATUS_FIELD …セレクトタイプフィールドの識別名（下図の赤枠部）
・BACKLOG_ STATUS_ID …※２で取得したセレクトタイプフィールドの「未対応」項目のID番号
・CONTACT_TITLE …「お問い合わせ件名」フィールドの識別名（下図の赤枠部）
・SLACK_WEBHOOK_URL … ※１で取得したWebhook のURL
これらをすべて差し込んで、以下のようにPHPを作成しました。
以上で設定は完了です！
▼SPIRALのトライアルはこちらから！
検証方法
いよいよ動作確認を行います。
- ページ等を使用してテストデータを登録
ステータスは「未対応」にします。 - スケジュールトリガから作成したアクションを開いて、「手動実行」をクリック
- Slackのチャンネルに通知が届くことを確認
実際に届いた通知はこちらです↓
無事に登録内容がSlackに表示されました！
「4. SPIRALでスケジュールトリガ→アクションを作成」で挿入したコードを編集して、業務にあった文言に変更してください！
まとめ
- SPIRALの「スケジュールトリガ」とSlackの「Incoming Webhook」を組み合わせるだけで、定期通知が実現できる
- 自分だけでなく、構築したアプリを使用する「チーム全員に便利な仕組み」をすぐ形にできるのがうれしかった
今後は、通知内容をより凝ったものにしたり、条件分岐で送信先を切り替えたりなどの応用も試してみたいです。
もしこの記事を読んで「試したい」と思ったら、まずはSPIRALのトライアル環境で触ってみるのがおすすめです。
今回のようにSlack連携は簡単に始められるので、業務効率化の第一歩に最適です！
-----------------------
私がインターンしているスパイラル株式会社は、ローコードプラットフォーム、SPIRAL ver.1のトライアルアカウントを無償提供しています。このアカウントの記事でも紹介するように、たくさんの機能がございます。
▶︎ フォーム
▶︎ 認証エリア
▶︎ ログイン
▶︎ メール送信
▶︎ カスタムプログラム
などの作成ができますので、ぜひ試してみてください!!
そして、今チームでトライアル登録者向けに、オンボーディングコンテンツを作成しています。SPIRAL ver.1にご興味のある方、ぜひこちらもご覧ください👇