メインコンテンツまでスキップ

Webhook 連携

フォームの送信が完了したとき、送信内容を JSON で外部の URL へ POST できます (v1.4.0 で追加)。 Zapier / Make / Google Apps Script / 自作 API など、外部サービス連携の入口になる機能です。

設定手順​

  1. フォーム編集画面の「連携」タブを開きます
  2. 「Webhook を追加」で送信先を追加します (1 フォームにつき最大 3 件)
  3. 各 Webhook に以下を設定して保存します
項目内容
有効 / 無効配信のオン・オフ
送信先 URL送信内容の POST 先。HTTPS のみ指定できます
署名シークレット自動生成されます。受信側でのなりすまし防止に使用 (再生成も可能)
テスト送信ダミーのペイロードを即時送信し、結果 (HTTP ステータス) をその場で表示
テスト送信はダミーデータです

テスト送信のペイロードはイベント名 submission.test、フィールドはサンプル 1 件のみです。 実際のフィールド構成での確認は、フォームから実際に送信してください。

送信されるリクエスト​

ヘッダー​

Content-Type: application/json; charset=utf-8
X-FPlant-Event: submission.completed
X-FPlant-Delivery: {配信ごとに一意の UUID。再試行時も同じ値}
X-FPlant-Signature: sha256={HMAC-SHA256 署名}

ボディ (JSON)​

{
  "event": "submission.completed",
  "form_id": 973,
  "form_title": "お問い合わせ",
  "submission_id": 1234,
  "submitted_at": "2026-07-12T18:30:00+09:00",
  "site_url": "https://example.com",
  "fields": [
    { "key": "your_name", "label": "お名前", "type": "name_parts", "value": "山田 太郎" },
    { "key": "topics", "label": "ご用件", "type": "checkbox", "value": ["資料請求", "見積もり"] }
  ]
}
  • value はメール本文と同じ整形済みの値です。チェックボックスなど複数選択は配列になります
  • ファイルアップロードはファイル名のみが入ります (ファイルの URL は第三者に渡るリスクがあるため含めません)
  • submitted_at はサイトのタイムゾーンの ISO 8601 形式です

配信の挙動​

  • 発火タイミング: メール送信後。確認画面を使うフォームでは最終送信の完了時のみ発火します。 エディターからのプレビュー送信や、スパム判定で弾かれた送信では発火しません
  • 成功判定: HTTP 2xx / 3xx を成功として記録します (リダイレクトは追従しません)。 Google Apps Script のようにリダイレクト (302) を返すサービスも「成功」と記録されます
  • 自動再試行: 失敗時 (接続不可 / タイムアウト / 4xx / 5xx) は 60 秒後に 1 回だけ自動で再試行します
  • 配信結果の確認: 送信データの詳細画面に URL ごとの結果 (成功 / 失敗と HTTP コード) が表示されます
送信データを保存しない設定の場合

フォーム設定で送信データを「保存しない」にしていると、配信結果の記録と自動再試行は行われません (記録先がないため)。配信自体は行われます。

署名シークレットとは (なりすまし防止)​

Webhook の受信 URL は、漏れたり推測されたりする可能性があります。URL さえ知っていれば誰でも 偽の JSON を POST できるため、受信側では「本当に自分のフォームから来たリクエストか」を 確認できることが重要です。

Form Plant は送信のたびに、シークレットを鍵にした本文の HMAC-SHA256 署名を X-FPlant-Signature ヘッダーに付与します。受信側で同じ計算をして一致を確認すれば、 シークレットを知らない第三者のなりすましや本文の改ざんを検出できます。

// PHP での検証例 (受信側)
$raw_body  = file_get_contents( 'php://input' );
$signature = 'sha256=' . hash_hmac( 'sha256', $raw_body, $secret ); // $secret = 画面に表示されたシークレット
if ( ! hash_equals( $signature, $_SERVER['HTTP_X_FPLANT_SIGNATURE'] ?? '' ) ) {
    http_response_code( 401 ); // 署名が合わない = 偽物なので拒否
    exit;
}

受け口ごとの使い分けの目安:

受け口署名シークレットの扱い
Google Apps Script使えません (GAS はリクエストヘッダーを取得できない仕様のため)。URL が推測困難なことに依存します
Zapier / Make通常は使いません (受信 URL の秘匿に依存)。ステップを組めば検証も可能です
自作 API (PHP 等)検証を推奨。上のコードでなりすまし・改ざんを排除できます

Google Apps Script 連携例 (スプレッドシートに記録)​

送信内容を Google スプレッドシートに 1 行ずつ記録する例です。

  1. スプレッドシートで「拡張機能」→「Apps Script」を開き、以下のコードを貼り付けます
  2. 「デプロイ」→「新しいデプロイ」→ 種類「ウェブアプリ」を選び、 アクセスできるユーザーを「全員」にしてデプロイします
  3. 表示されたウェブアプリの URL を Form Plant の送信先 URL に設定します
function doPost(e) {
  try {
    var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
    var data = JSON.parse(e.postData.contents);

    // 1 行目をヘッダー行として使う。空のシートなら基本列を作る
    var lastCol = sheet.getLastColumn();
    var headers = lastCol > 0 ? sheet.getRange(1, 1, 1, lastCol).getValues()[0] : [];
    if (headers.length === 0) {
      headers = ['受信日時', '送信ID'];
      sheet.getRange(1, 1, 1, headers.length).setValues([headers]);
    }

    // 行データを組み立てる (ヘッダーと同じ位置に値を入れる)
    var row = [];
    row[0] = new Date();
    row[1] = data.submission_id;

    (data.fields || []).forEach(function (field) {
      var header = field.label || field.key; // 列見出しにはフィールドのラベルを使う
      var col = headers.indexOf(header);
      if (col === -1) {
        // ヘッダーに無いフィールドは右端に列を追加
        headers.push(header);
        col = headers.length - 1;
        sheet.getRange(1, col + 1).setValue(header);
      }
      // チェックボックスなど複数値の場合はカンマ区切りにする
      row[col] = Array.isArray(field.value) ? field.value.join(', ') : field.value;
    });

    // 値が無い列を空文字で埋めてから追記
    for (var i = 0; i < headers.length; i++) {
      if (row[i] === undefined) row[i] = '';
    }
    sheet.appendRow(row);

    return ContentService.createTextOutput(JSON.stringify({ status: 'success' }))
      .setMimeType(ContentService.MimeType.JSON);

  } catch (error) {
    console.error(error);
    return ContentService.createTextOutput(JSON.stringify({ status: 'error', message: error.toString() }))
      .setMimeType(ContentService.MimeType.JSON);
  }
}

1 行目のヘッダーは自動で管理され、フォームにフィールドを追加すると右端に列が増えます。

GAS 利用時の注意
  • 配信結果は「HTTP 302 / 成功」と記録されます (GAS の仕様で、処理成功後に必ずリダイレクトが返るため)
  • コードを変更したら再デプロイが必要です。「デプロイ」→「デプロイを管理」→ 鉛筆アイコン → 「バージョン: 新バージョン」→「デプロイ」で更新してください (この手順なら URL は変わりません。 「新しいデプロイ」を作ると URL が変わり、Form Plant 側の再設定が必要になります)
  • テスト送信の行を記録したくない場合は、data.event !== 'submission.completed' のときに appendRow をスキップする分岐を追加してください

Zapier / Make との連携​

どちらも「Webhook を受け取る」トリガーが用意されています。

  • Zapier: トリガーに「Webhooks by Zapier」→「Catch Hook」を選び、表示された URL を送信先に設定
  • Make: 「Webhooks」→「Custom webhook」を作成し、表示された URL を送信先に設定

設定後にフォームから 1 件送信 (またはテスト送信) すると、受信したフィールド構造が 各サービス側に認識され、後続ステップで値を使えるようになります。

開発者向け: フィルターでのカスタマイズ​

フィルター用途
fplant_webhook_should_send送信可否を条件制御 (false で送信しない)
fplant_webhook_payloadペイロードの加工 (項目の追加・削除)
fplant_webhook_request_argsHTTP リクエスト引数の変更 (タイムアウト等)
fplant_webhook_allow_httphttp:// URL の許可 (ローカル開発向け)

詳細は PHP フックリファレンス を参照してください。