Google SheetsのデータをWebhookでZoho Formsに事前入力する設定

Google SheetsのデータをWebhookでZoho Formsに事前入力する設定

お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

Zoho Forms では、外部ソースから取得したデータを使って、フォーム項目を動的に事前入力できます。よくある利用例としては、Google スプレッドシートに保存されている顧客データを取得し、ユーザーがフォームを開いたときに自動で入力しておく方法があります。これにより、時間を節約し、入力ミスを減らし、ユーザー体験を向上させることができます。

この記事では、Google スプレッドシート用の Apps Script を設定し、Web アプリとしてデプロイし、それを Zoho Forms の動的プレフィル Webhook と連携する手順を、ステップごとに説明します。

この設定方法を短い動画でも確認できます。


  1. データが保存されている Google スプレッドシートを開きます。


  2. 上部メニューから次をクリックします：
    拡張機能 → Apps Script。


  3. 新しいタブでApps Script エディタが開きます。

  4. 次のスクリプトをコピー＆ペーストします。

    function doGet(e) {

    const sheetId = '{sheet_id}'; // <-- Replace with your real sheet ID

    const sheetName = 'Sheet1'; // <-- Replace with your real sheet Name

    const columnToSearch = 1; // e.g., Column B = 2

    const query = e.parameter.query; // Example: ?query=Doe

    if (!query) {

    return HtmlService.createHtmlOutput('Missing query');

    }

    const sheet = SpreadsheetApp.openById(sheetId).getSheetByName(sheetName);

    const range = sheet.getRange(2, columnToSearch, sheet.getLastRow() - 1, 1);

    const finder = range.createTextFinder(query)

    .matchEntireCell(true) // Exact match

    .matchCase(false); // Case-insensitive

    const match = finder.findNext(); // FIRST MATCH ONLY

    if (!match) {

    return HtmlService.createHtmlOutput('No matching row found');

    }

    const row = match.getRow();

    const data = sheet.getRange(row, 1, 1, sheet.getLastColumn()).getValues()[0];

    return ContentService.createTextOutput(

    JSON.stringify({

    row: row,

    data: data

    })

    ).setMimeType(ContentService.MimeType.JSON);


    }

  5. Google スプレッドシートの URL から、図のようにsheetIdをコピーします。

  6. スクリプト内のsheetIdを、コピーした Google スプレッドシートの ID に置き換えます。



  7. 図のように、シート名を実際のシート名に置き換えます。

  8. 一意の識別子（例：メールアドレス、ID）が保存されている列番号に置き換えます。数値で指定します。
    たとえば、メールアドレスが B 列に保存されていて、それで検索したい場合は、const columnToSearch = 2; と設定します。


  9. Apps Script エディタ右上のデプロイボタンをクリックし、新しいデプロイを選択します。


  10. 種類を選択で、ウェブアプリを選択します。


  11. 各項目を次のように入力します。

    • 説明：Fetch data API など、わかりやすい説明を入力します。

    • 実行するユーザー：自分（自分のアカウント）。

    • アクセスできるユーザー：全員。


  12. デプロイをクリックします。

  13. 初回のデプロイ時には、Google から権限の許可を求められます。承認をクリックします。


  14. デプロイ後、Google からウェブアプリの URLが発行されます。


  15. ブラウザーで、シートの検索対象列にある値を使ってスクリプトをテストできます。


  16. その行のデータを含む JSON レスポンスが返されます。


  17. Zoho Forms でフォームビルダーを開きます。[プレフィル] セクションに移動し、Prefill-Webhook 項目を追加します。

  18. Webhook 設定で、検索項目として Employee ID を選択します。ここで選択する項目が、Google スクリプト内で設定した columnToSearch の列と一致していることを確認してください。

  19. Webhook URL に、コピーしたウェブアプリの URL を貼り付けます。

  20. URL パラメーターに query と入力します。[次へ]をクリックします。



  21. 検索項目の値として 1002 などを使って Webhook をテストし、受信したレスポンスが正しいか確認します。



  22. シートからのレスポンス内のフィールドを、対応するフォーム項目にマッピングします。



  23. [保存]をクリックします。

これで、回答者がフォームを開いて Employee ID を入力し、検索アイコンをクリックすると、フォームから Google スプレッドシートにアクセスして詳細を取得し、フォームが自動的に事前入力されるようになります。