今回はフォーム機能に新しく追加されたWebhook機能を利用して、Google スプレッドシートに送信データを直接送る方法をご紹介します。
※ Webhook 機能は MovableType.net、MovableType.net フォーム共にスタンダードプラン以上で利用できます。

Google スプレッドシート側の設定

まず、新しくスプレッドシートを作成します。

次に、ツールメニューのスクリプトエディタを選択します。

スクリプトエディタ画面が開いたら、以下のスクリプトを貼り付けます。今回のスクリプトでは、添付ファイルの項目の場合はGoogleドライブにアップロードしてURLを表示します。

function doPost(e) {
  var sheet = SpreadsheetApp.getActive().getActiveSheet();
  var entryJson = e.parameter.entry;
  var signature = e.parameter.signature;
  
  // シグニチャの検証
  var secret = "secret" // Webhook設定の「secret」に入力した値に変更する。
  var byteArray = Utilities.computeHmacSha256Signature(entryJson, secret, Utilities.Charset.UTF_8);

  // シグニチャは１６進数で送られてくるのでbyte arrayを16進数の値に変換する。
  var signatureVerify = Array.from(byteArray, function(byte) {
    return ('0' + (byte & 0xFF).toString(16)).slice(-2);
  }).join('');
  
  if (signature !== signatureVerify) {
    throw new Error("Invalid Signature");
  }

  // Google Drive のフォーム用のフォルダを取得
  var folder;
  var folderName = 'Webhook Form';
  var folderIterator = DriveApp.getFoldersByName(folderName);
  if (folderIterator.hasNext()) {
    folder = folderIterator.next();
  }
  
  // Google Drive にフォルダが見つからなかったらフォルダを作成
  if (!folder) {
    folder = DriveApp.createFolder(folderName);
  }
  
  var entry = JSON.parse(entryJson);
  
  // ヘッダーがなければヘッダーをつくる
  var a1 = sheet.getRange('A1').getValue();
  if (!a1) { 
    var headers = ['受付番号', '日付'];
    for (var i=0; i<entry.columns.length; i++) {
      headers.push(entry.columns[i].label);
    }
    sheet.appendRow(headers);
  }
  
  // 行を追加する
  var sequenceNumber = entry.sequence_number.toString();
  var rows = [
    sequenceNumber, 
    new Date(Date.parse(entry.created_at) + 32400000) // 日本時間で表示する
  ];

  // entry用のフォルダを作成
  var entryFolder;
  var entryFolderIterator = folder.getFoldersByName(sequenceNumber);
  if (entryFolderIterator.hasNext()) {
    entryFolder = folderIterator.next();
  }
  
  if (!entryFolder) {
    entryFolder = folder.createFolder(sequenceNumber);
  }
  
  for (var i=0; i<entry.columns.length; i++) {
    var column = entry.columns[i];
    
    if (column.type === "file" && column.url) {
      try {
        var response = UrlFetchApp.fetch(column.url);
        var fileBlob = response.getBlob();
        var file = entryFolder.createFile(fileBlob);
        rows.push(file.getDownloadUrl());
      } catch (error) {
        rows.push(column.url);
      }
    } else {
      rows.push(column.value);      
    } 
  }
    
  sheet.appendRow(rows);
   
  return HtmlService.createHtmlOutput("Entry accepted");
}

1点変更が必要で、シグニチャの検証のsecretの部分を後ほどMovableType.net側で設定するものと同じものにします。

スクリプトの編集が終わったら、公開メニューからウェブアプリケーションとして導入を選びます。

スクリプトに名前をつけていない場合は以下の画面が表示されるので名前を設定します。

Deploy as web app の画面が表示されるので、Excute the app as は Me（自分のアカウントのメールアドレス）を選択し、Who has access to the app では Anyone, even anonymous を選択して Deploy ボタンを押します。

許可を求めるウィンドウが表示されるので、許可を確認を選択します。

その後、自分のGoogleアカウントを選択すると、以下の画面が表示されますが詳細をクリックして進みます。

さらにフォームスクリプト（安全ではないページ）に移動をクリックします。

権限を確認する画面が表示されるので、許可ボタンを押します。

ウェブアプリとしてデプロイしたメッセージが表示されるので、Current web app URLをコピーします。

MovableType.net 側のフォームの設定

MovableType.net 側のフォームの設定は、各フォームの基本設定の受付データのデータの保存でWebhookに送信を選択し、先程コピーしたURLを Payload URL の欄に貼り付け、Secret 欄には先程スクリプト内で指定したものと同じものを記述します。

上記設定を行い保存すれば、Webhook連携は完了です。

後は実際にフォームのデータを送信すると

以下のようにGoogleスプレッドシートに直接データが送られます。

以上、効率的なフォームの運用にご活用ください。