Platioの便利な機能や新しくリリースした機能などをPlatioオススメ機能として紹介していきます。
今回はPlatioのWebhookを使って、Platioアプリで入力した情報をGoogleスプレッドシートに連携する方法を紹介します。
Webhookとは、特定のイベントが発生したタイミングで、別のWebアプリケーションなどに通知や情報を提供する仕組みです。
PlatioのWebhook機能を使うことで、Platioアプリで情報入力などを行ったタイミングでそれらの情報を、他のWebアプリケーションやサービスに登録／通知することができるようになります。
今回は勤怠連絡の業務を例に、Platioアプリで入力した情報をGoogleスプレッドシートに連携させるための設定などについて説明します。
※ 本記事では、Platioアプリに入力された情報をGoogleスプレッドシートに登録するための設定に限定して紹介いたします。
※ 本記事はあくまでもWebhookの設定イメージを把握いただくための例であり、実際の設定などに関するお問い合わせには対応しておりませんので、ご了承ください。
※ 連携先のサービスまたはWebアプリケーションの設定などについては、サービスまたはWebアプリケーションの開発／提供元にお問い合わせください。
「勤怠連絡」ミニアプリは、ミニアプリテンプレートから作成します。「勤怠連絡」ミニアプリの詳細については、こちらにてご確認ください。
以下は、「勤怠連絡」ミニアプリにある「勤怠連絡」データポケットで入力・閲覧できる項目の構成です。（（）内はPlatioのフィールドタイプ）
Googleスプレッドシート側に「勤怠連絡」データポケットで入力された「取得申請日」、「報告者」、「報告内容」、「出社予定時間」、「理由」、「詳細」、「作業内容」を登録するためのシートを作成します。
1行目には項目名を設定します。ここではスプレッドシート名を「勤怠管理-202307」とします。
Googleスプレッドシートの「機能拡張」より「Apps Script」を選択します。
Google Apps Scriptは、GmailやGoogleスプレッドシートなどのGoogleの提供するサービスと連携して利用するためのプログラミング言語です。
ここではプロジェクトの名前を「勤怠管理」とし、[コード.gs]にGoogleスプレッドシートにレコードを追加するための処理をGoogle App Scriptで記述します。
記述が完了したら、プロジェクトを保存します。
参考までに、今回作成したGoogle App Scriptは以下となります。
// POSTリクエスト
function doPost(e){
let postContent = e.postData.getDataAsString(); // POSTされたデータの取得
main(postContent); // 主処理
}
// 主処理
function main(message){
let json = JSON.parse(message); //キーバリューをデータに変換
let sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName('シート1'); // 追加するシートを取得
let headerRow = sheet.getDataRange().getValues()[0]; // ヘッダー行の取得
insertRows(sheet, headerRow, json); // データの追加
}
// データの追加
function insertRows(sheet, headerRow, jsonMessage){
for(let row of jsonMessage.rows){ // データの行数分ループ
let rowArray = [];
for(let colName of headerRow){ // ヘッダーの項目数分ループ
rowArray.push(row[colName]);// ヘッダーと同じ項目の値を追加
}
sheet.appendRow(rowArray); // シートに行を追加
}
}
次に「デプロイ」をクリックし、「新しいデプロイ」をクリックします。
「新しいデプロイ」で「種類の選択」の歯車アイコンをクリックし、”ウェブアプリ”を選択します。
右側の「設定」にて、「説明」に任意の説明文を入力し、「ウェブアプリ」の「次のユーザーとして実行」を”自分(任意のGmailのアドレス)”、「アクセスできるユーザー」を”全員”に設定し、「デプロイ」をクリックします。
しばらくすると、「新しいデプロイ」画面が表示されるので、「アクセスを承認」をクリックします。
「Googleにログイン」画面が表示されるので、Googleスプレッドシートを作成したユーザーを選択します。
次の画面が表示されたら、「詳細」をクリックします。
さらに次の画面が表示されたら、「勤怠管理（安全ではないページに移動）」をクリックします。（「勤怠管理」の部分には自身が設定したプロジェクトの名前が表示されます。）
作成したプロジェクトがGoogleアカウントへのアクセスのリクエスト確認画面が表示されるので、「許可」をクリックします。
「新しいデプロイ」画面が表示され、”デプロイを更新しました。”と表示されていれば、完了です。「ウェブアプリ」のURLの「コピー」をクリックし、しメモ帳などに保存します。
Platio Studioで「勤怠連絡」ミニアプリを開き、画面右側にある[Webhook]をクリックします。
表示された画面に上部にある[Webhookを追加]ボタンをクリックして、Webhookを設定します。
なお、Webhookには、設定できる数の上限（１ミニアプリあたり30個）や1時間あたりの呼び出し回数も設けられていますので、注意が必要です。
表示された設定画面で、[名前]にはWebhookの名前を設定します。Webhookの一覧画面で表示されるので、どのような処理を行っているのか分かりやすい名前を設定することをおすすめします。
[データポケット]には連携元のデータポケットを、[モード]は”クイック”を指定します。なお、スタンダード環境の場合、指定できるモードはクイックのみとなります。
[モード]についての詳細は「Webhookプログラミングガイド」にある「モードとエラー処理」にてご確認ください。
今回はレコードが登録されたときにWebhookを動作させるため、[イベント]は”レコードの挿入”にチェックを入れます。
[URL]には、さきほどコピーしたGoogle App ScriptのウェブアプリのURLを設定します。
Googleスプレッドシートにレコードを登録するため、[HTTPメソッド]には”POST”を、[タイプ]には”JSON”を指定します。
[変換]には、以下の書式でGooglesプレッドシートの項目とデータポケットのフィールドの対応づけを行います。
{
"rows": [
{"取得申請日": formatDateTime(parseDate(c1111111 /* 取得申請日フィールドのID */),"YYYY/MM/DD"),
"報告者": c2222222 /* 報告者フィールドのID */,
"報告内容": c3333333 /* 報告内容フィールドのID */,
"出社予定時間": c4444444 /* 出社予定時間フィールドのID */,
"理由": c5555555 /* 理由フィールドのID */,
"詳細": c6666666 /* 詳細フィールドのID */,
"作業内容": c7777777 /* 作業内容フィールドのID */}
]
}※ 上記のコードをコピーし、斜体部分を変更してください。
これで、Platioの「勤怠連絡」データポケットで情報を登録すると、Googleスプレッドシートに自動でその内容が反映されるようになります。
PlatioのWebhookの実行回数やログについては、Webhookの一覧画面から確認することができます。
今回はPlatioのWebhook機能を使ったGoogleスプレッドシートへの連携について紹介しました。Webhookをお使いいただくことで、Platioで情報登録などを行ったタイミングで他のWebアプリケーションやサービスにデータの登録や通知を行なうことができ、より作業の効率化が可能になりますので、ぜひ、試してみてください！
※ 記載している会社名、商品名は各社の商標または登録商標です。
