学生インターンシップです!
スパイラル株式会社の学生インターンとして、SPIRALを学習しながらユーザー目線で質問に答える活動をしています。
補足情報や調査結果の提供を行い、皆様のお役立てができればと思っています!
※学生が学びの一環として調査・まとめた内容です。
正確な仕様や最新情報は、公式リファレンスをご確認ください。
はじめに
お客様のアンケートやご意見をフォームから収集した際に、
即対応する必要があるご意見や問題を見逃してしまいそうになったり、送られたフォームをすぐに確認することが難しいときなどはありませんか。
そこで今回はこれらの課題を解決すべく、SPIRALver.2×n8nを連携した「AIによる問い合わせの緊急度付けメール配信システム」を作成します。
メール配信により、送信されたフォームの緊急性(重要度)を示し、優先順位を手助けしたお客様対応における業務の効率化を目指します!
所要時間は40分ほどで作成できるので、ぜひお試しください!
事前準備
連携を始める前に、以下のアカウントとサービスを用意しておく必要があります。
・n8nアカウント(リンクで14日間無料トライアル可能(2026年2月10日現在))
登録はこちらから
SPIRALの設定
フォーム作成の設定
今回はSPIRALver.2を使用して、お客様からのご意見を収集することを想定したご意見フォームを作成します。
1. 右上の歯車から「アプリ管理」をクリックします。
2.「アプリ管理」の「+」ボタンからアプリを作成します。
3. 作成したアプリにDBを作成します。
今回は簡単にテキストとテキストエリアを用いて、「氏名」と「ご意見」の2つのフィールドを用意しました。
4. 右上の歯車から「サイト管理」をクリックします。
5.「サイト管理」の「+」ボタンからサイトを作成します。
6.「ページ」の「+」ボタンからページを作成します。
7. 作成したページの「ブロック設定」から登録フォームを作成します。
選択するアプリとDBには先ほど作成したものを選択してください。
続くフィールド選択では、先ほど作成した氏名とご意見のフィールドを「使用」へ追加し、作成をクリックします。
これでアプリ作成からフォーム作成まで完成しました。
トリガ設定
次にフォームからDBに登録された情報をn8nに渡すためのトリガ設定を行います。
1. 作成したDBからトリガ設定をクリックします。2. 非同期アクション設定の「+」をクリックし、PHP実行をクリックし作成します。
<?php
// 予約データの取得($SPIRALから必要な情報を取得)
$record = $SPIRAL->getRecord();
// n8nに送信するitem(送信するitemの識別名をいれてください)
$reservationData = array(
'form_id' => $record["item"][""],
'form_name' => $record["item"][""],
'form_opinion' => $record["item"][""],
);
// n8nに送信するためのWebhook URL(n8nで取得したものに置き換えてください)
$n8n_webhook_url = '';
// cURLを使用してn8nにデータを送信
$ch = curl_init($n8n_webhook_url);
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CUROPT_POSTFIELDS, json_encode($reservationData));
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: application/json'));
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
// 送信実行
$response = curl_exec($ch);
curl_close($ch);
?>
参考コード
3. トリガの作成が完了したら、アクションの「有効化」をクリックし、実行可能にしておきます。
これでトリガ設定が完成し、SPIRAL側の設定が完了しました。
n8nの設定
n8nにログインし、SPIRALと連携するコードを作成します。
1. n8nにログインし、右端の「+」ボタンをクリックします。
2. 右クリックし、「add node」から「webhook」を選択します。
3. webhookにより、SPIRALからのデータをn8nで受け取ることが出来ます。
webhookの設定は以下の通りです。
HTTP Method : POST
Path : spiral-webhook
Authentication : none
4. webhook内にURLが設定されているので、このURLをSPIRALのPHPに張り付けます。5. 作成したwebhookの隣に「Edit Fields」のnodeを追加します。
6. Edit FieldsでSPIRALから受け取った情報から必要なじょうほうを抽出します。
Edit Fieldsの設定は以下の通りです。
Mode : Manual Mapping
Fields to Set : body.from_opinion
T : String
= : {{ &json.body.from_opinion}}
7. 作成したEdit Fieldsの隣に「AI Agent」のnodeを2つ続けて追加します。それぞれ同様に以下設定を行います。
Source for Prompt : Define below
Prompt : データを基にAIに尋ねたいことをそれぞれ入力
AI Agent1 : {{ $json.body.form_opinion }}の意見を分析して、即対応度を示す重要度(5段階)を星の数で
出力してください。出力は星の数のみでお願いします。
AI Agent2 :「{{ $('Edit Fields1').item.json.body.form_opinion }}」の意見を分析して、要約(30字以内)
を出力してください。
8. AI Agentの「Chat Model」から使用するAIモデルを選択し、設定してください。今回はGoogle Gimini Chat Modelを使用しています。
AIモデルによっては自身のアカウントを登録する必要があります。
9. 作成したEdit Fieldsの隣に「Send a messeage」のnodeを追加します。
10. send a messageではAIを用いてえた出力をメールで送信しお知らせします。
send a messageの設定は以下の通りです。
Credential to connect with : 送信するアドレスを入力してください
Resourse : Message
Operetion : Send
To : 受信するメールアドレスを入力してください
Subject : 【{{ $('AI Agent1').item.json.output }}】ご意見フォームの受信
Message : 重要度{{ $('AI Agent1').item.json.output }}のご意見フォームを受信しました。
内容はの要約は下記の通りです。
フォームID:{{ $('Webhook1').item.json.body.form_id }}
{{ $json.output }}
11. 最後に画面右上のPublishをクリックしてください
これで、n8nの設定が完了しました。
AIを使用する際は、入力する情報の取扱いに注意してください。
メールアドレスや、氏名など個人を特定できる情報の入力はお控えください。
動作確認
ご意見フォームに以下の内容を送信しました。
「本日リリースされた新しい申請アプリですが、入力画面でエラーコード『E-502』が出てしまい、
社員情報の登録が全くできない状態です。本日中に100名分の登録を終える必要があり、現場が
パニックになっています。至急、復旧の目処を教えてください。また、入力途中のデータが
消えていないかも心配です。早急な対応をお願いします。」
フォーム送信後、登録したメールアドレス先に以下のメールを確認できました。
まとめ
今回は、メールで伝達するAIによる問い合わせの緊急度付けシステムを作成しました。このシステムを活用することで、緊急性の高いフォームにいち早く対応することが可能となります。
n8nとSPIRALとのAPI連携を行うことが出来ればAIを用いたさらなる業務効率化に期待できそうです。
ローコード同士でとても分かりやすく視覚的に操作することができるので皆様もぜひお試しください。