Googleフォームの入力結果を、他のツールへリアルタイム連携する｜make活用

ふじわらこうすけ

2023年8月26日 17:21

僕のnoteでは、webflowでエントリーフォームなどを作成し、makeでデータを処理する形がほとんどです。

ただ、何かアンケートなどを取る時には、Googleフォームを利用されているケースが世間的には多い気がするので、Googleフォームからデータをmakeで使えるようにするための手順を書き残しておきます。

webhooks URLを発行する

発行の方法は、こちらの記事を参照ください。

Googleフォームを準備する

Googleフォームを普段から使用されている方は、いつも通り作成をしてください。

画面右上のメニューから「スクリプトエディタ」を選択する

スクリプトエディタの処理

コードの部分に、スクリプトを記載する

コードの中身

var POST_URL = "ここにwebhooksURLが入るよ";
function onSubmit(e) {
    var form = FormApp.getActiveForm();
    var allResponses = form.getResponses();
    var latestResponse = allResponses[allResponses.length - 1];
    var response = latestResponse.getItemResponses();
    var payload = {};
    for (var i = 0; i < response.length; i++) {
        var question = response[i].getItem().getTitle();
        var answer = response[i].getResponse();
        payload[question] = answer;
    }

    var options = {
        "method": "post",
        "contentType": "application/json",
        "payload": JSON.stringify(payload)
    };
UrlFetchApp.fetch(POST_URL, options);
};

要約すると、このコードはGoogleフォームが提出されたときに、最新の回答を取得し、その内容をJSON形式で外部のサービスにPOSTするものです。

変数の宣言

var POST_URL = "https://hook.us1.make.com/hogehogehogehogehogehoge";

この行は、外部サービスにデータをPOSTするためのURLを定義しています。

onSubmit関数
この関数は、Googleフォームが提出されたときに実行されることを想定しています。

フォーム情報の取得

var form = FormApp.getActiveForm();
var allResponses = form.getResponses();

`FormApp.getActiveForm()`を使用して、現在のフォームの情報を取得しています。`getResponses()`メソッドでフォームのすべての回答を取得します。

最新の応答を取得

var latestResponse = allResponses[allResponses.length - 1];

`allResponses`配列の最後の要素（つまり、最新の回答）を取得します。

回答をペイロードに変換

var response = latestResponse.getItemResponses();
var payload = {};
for (var i = 0; i < response.length; i++) {
    var question = response[i].getItem().getTitle();
    var answer = response[i].getResponse();
    payload[question] = answer;
}

最新の応答の各項目を反復処理し、質問をキーとして、その答えを値としてペイロードオブジェクトを構築します。

データのPOST

var options = {
    "method": "post",
    "contentType": "application/json",
    "payload": JSON.stringify(payload)
};
UrlFetchApp.fetch(POST_URL, options);

`UrlFetchApp.fetch`メソッドを使用して、先に定義された`POST_URL`にペイロードをPOSTします。データはJSON形式で送信されます。