データの受け入れを開始するための Google Sheets または Microsoft Excel ファイルの設定
フォームを作成してプレビューしたら、対応するスプレッドシートでデータの受信を開始できるようにします。スプレッドシートでデータを受け入れるように手動で有効にすることも、スプレッドシートでデータを受け入れるように Admin API を使用して有効にすることもできます。
スプレッドシートでデータを受け入れるように手動で有効にする
スプレッドシートでデータを受け入れるようにするには
-
フォームが含まれているスプレッドシートを開き、新しいシートを追加し、名前を
incoming
に変更します。note warning WARNING incoming
シートが存在しない場合、AEM ではスプレッドシートにデータを送信しません。 -
このシートに、「intake_form」という名前のテーブルを挿入します。フォームフィールド名と一致させるために必要な列の数を選択します。次に、ツールバーで挿入/表に移動し、「OK」をクリックします。
-
表の名前を「intake_form」に変更します。Microsoft Excel で表の名前を変更するには、表を選択し、「表書式」をクリックします。
-
次に、フォームフィールド名を表ヘッダーとして追加します。フィールドが完全に同じであることを確認するには、「shared-default」シートからフィールドをコピー&ペーストします。「shared-default」シートで、送信フィールドを除く「Name」列の下にリストされるフォーム ID を選択してコピーします。
-
「incoming」シートで、形式を選択して貼り付け/行/列の入れ替えを選択して、フィールド ID をこの新しいシートの列ヘッダーとしてコピーします。データを取得する必要があるフィールドのみを保持し、他のフィールドは無視できます。
shared-default
のName
列の各値は、送信ボタンを除き、incoming
シートのヘッダーとして機能します。例えば、「お問い合わせ」フォームのヘッダーを示す次の画像を考慮してみましょう。 -
AEM Sidekick 拡張機能を使用して、フォームの更新をプレビューします。これで、シートはフォームの送信を受け入れる準備が整いました。
note note NOTE 以前にシートをプレビューしたことがある場合でも、 incoming
シートを初めて作成した後に再度プレビューする必要があります。
フィールド名が incoming
シートに追加されると、フォームは送信を受け入れる準備が整います。フォームをプレビューし、これを使用してデータをシートに送信できます。
データを受信するようにシートを設定したら、アダプティブフォームブロックを使用してフォームをプレビューしたり、POST リクエストを使用してシートへのデータの送信を開始したりできます。
スプレッドシートでデータを受け入れるように Admin API を使用して有効にする
また、POST リクエストをフォームに送信して、データを受け入れ、incoming
シートのヘッダーを設定するように有効にすることもできます。POST リクエストを受信すると、サービスではリクエストの本文を分析し、データの取り込みに必要な必須のヘッダーとシートを自律的に生成します。
スプレッドシートでデータを受け入れるように Admin API を使用して有効にするには:
-
作成したワークブックを開き、デフォルトのシートの名前を
incoming
に変更します。note warning WARNING incoming
シートが存在しない場合、AEM ではこのワークブックにデータを送信しません。 -
Sidekick でシートをプレビューします。
note note NOTE 以前にシートをプレビューしたことがある場合でも、 incoming
シートを初めて作成した後に再度プレビューする必要があります。 -
POST リクエストを送信して
incoming
シートに適切なヘッダーを生成し、shared-default
シートがまだ存在しない場合はスプレッドシートに追加します。シートを設定する POST リクエストの形式については、Admin API ドキュメントを参照してください。以下に例を示します。
リクエスト
code language-json POST 'https://admin.hlx.page/form/{owner}/{repo}/{branch}/contact-us.json' \ --header 'Content-Type: application/json' \ --data '{ "data": { "Email": "john@wknd.com", "Name": "John", "Subject": "Regarding Product Inquiry", "Message": "I have some questions about your products.", "Phone": "123-456-7890", "Company": "Adobe Inc.", "Country": "United States", "PreferredContactMethod": "Email", "SubscribeToNewsletter": true } }'
応答
code language-json HTTP/2 200 content-type: application/json x-invocation-id: 1b3bd30a-8cfb-4f85-a662-4b1f7cf367c5 cache-control: no-store, private, must-revalidate accept-ranges: bytes date: Sat, 10 Feb 2024 09:26:48 GMT via: 1.1 varnish x-served-by: cache-del21736-DEL x-cache: MISS x-cache-hits: 0 x-timer: S1707557205.094883,VS0,VE3799 strict-transport-security: max-age=31557600 content-length: 138 {"rowCount":2,"columns":["Email","Name","Subject","Message","Phone","Company","Country", "PreferredContactMethod","SubscribeToNewsletter"]}%
以下に示すように、cURL や Postman などのツールを使用して、この POST リクエストを実行できます。
code language-json curl -s -i -X POST 'https://admin.hlx.page/form/wkndforms/portal/main/contact-us.json' \ --header 'Content-Type: application/json' \ --data '{ "data": { "Email": "john@wknd.com", "Name": "John", "Subject": "Regarding Product Inquiry", "Message": "I have some questions about your products.", "Phone": "123-456-7890", "Company": "Wknd Inc.", "Country": "United States", "PreferredContactMethod": "Email", "SubscribeToNewsletter": true } }'
上記の POST リクエストでは、フォームフィールドとそれぞれのサンプル値の両方を含むサンプルデータを提供します。このデータは、フォームを設定するために Admin サービスによって使用されます。
これで、フォームでデータを受け入れるように有効にしました。また、スプレッドシートに次の変更が見られることもわかります。
データを受け入れるように有効になると、シートが自動的に変更される。
データを受信するようにシートを設定すると、スプレッドシートに次の変更が見られます。
「Slack」という名前のシートが Excel ワークブックまたは Google Sheets に追加されます。このシートでは、新しいデータがスプレッドシートに取り込まれるたびに、指定した Slack チャネルに対する自動通知を設定できます。現在、AEM では、AEM エンジニアリング Slack 組織とアドビエンタープライズサポート組織への通知のみをサポートします。
-
Slack 通知を設定するには、Slack ワークスペースの「teamId」と、「チャネル名」または「ID」を入力します。また、slack ボットに(debug コマンドを使用して)「teamId」と「チャネル ID」を問い合わせることもできます。チャネル名を変更しても残り続けるので、「チャネル名」の代わりに「チャネル ID」を使用することをお勧めします。
note note NOTE 古いフォームには「teamId」列がありませんでした。「teamId」は「#」または「/」で区切られてチャネル列に含まれていました。 -
必要なタイトルを入力し、フィールドの下に Slack 通知に表示するフィールドの名前を入力します。各見出しはコンマで区切る必要があります(名前、メールなど)。
note warning WARNING 「shared-default」シートには、一般にアクセスされることに抵抗のある個人を特定できる情報や機密データを決して含めないでください。
シートへのデータの送信 send-data-to-your-sheet
データを受信するようにシートを設定したら、アダプティブフォームブロックを使用してフォームをプレビューするか、Admin API を使用してシートへのデータの送信を開始できます。
Admin API を使用してシートにデータを送信
hlx.page、hlx.live、または実稼動ドメインを使用して、POST リクエストをフォームに直接送信し、データを送信できます。
POST https://branch–repo–owner.hlx.(page|live)/email-form
POST https://my-domain.com/email-form
.live
または実稼動ドメインで機能するには、シートを公開する必要があります。フォームデータの書式設定
POST 本文のフォームデータを書式設定するには、いくつかの方法があります。以下を使用できます。
-
name:value
のペアの配列:code language-json { "data": [ { "name": "name", "value": "Clark Kent" }, { "name": "email", "value": "superman@example.com" }, { "name": "subject", "value": "Regarding Product Inquiry" }, { "name": "message", "value": "I have some questions about your products." }, { "name": "phone", "value": "123-456-7890" }, { "name": "company", "value": "Example Inc." }, { "name": "country", "value": "United States" }, { "name": "preferred_contact_method", "value": "Email" }, { "name": "newsletter_subscribe", "value": true } ] }
例:
code language-json curl -s -i -X POST 'https://main--portal--wkndforms.hlx.page/contact-us' \ --header 'Content-Type: application/json' \ --data '{ "data": [ { "name": "name", "value": "Clark Kent" }, { "name": "email", "value": "superman@example.com" }, { "name": "subject", "value": "Regarding Product Inquiry" }, { "name": "message", "value": "I have some questions about your products." }, { "name": "phone", "value": "123-456-7890" }, { "name": "company", "value": "Example Inc." }, { "name": "country", "value": "United States" }, { "name": "preferred_contact_method", "value": "Email" }, { "name": "newsletter_subscribe", "value": true } ] }'
-
key:value
のペアを持つオブジェクト:code language-json { "data": { "name": "Jessica Jones", "email": "jj@example.com", "subject": "Regarding Product Inquiry", "message": "I have some questions about your products.", "phone": "123-456-7890", "company": "Example Inc.", "country": "United States", "preferred_contact_method": "Email", "newsletter_subscribe": true } }
例:
code language-json curl -s -i -X POST 'https://admin.hlx.page/form/wkndforms/portal/main/contact-us.json' \ --header 'Content-Type: application/json' \ --data '{ "data": { "Email": "khushwant@wknd.com", "Name": "khushwant", "Subject": "Regarding Product Inquiry", "Message": "I have some questions about your products.", "Phone": "123-456-7890", "Company": "Adobe Inc.", "Country": "United States", "PreferredContactMethod": "Email", "SubscribeToNewsletter": true } }'
-
URL エンコードされた(
x-www-form-urlencoded
)本文(content-type
ヘッダーがapplication/x-www-form-urlencoded
に設定されている)code language-shell 'Email=kent%40wknd.com&Name=clark&Subject=Regarding+Product+Inquiry&Message=I +have+some+questions+about+your+products.&Phone=123-456-7890&Company=Adobe+Inc.& Country=United+States&PreferredContactMethod=Email&SubscribeToNewsletter=true'
例:
code language-shell curl -s -i -X POST \ -d 'Email=kent%40wknd.com&Name=clark&Subject=Regarding+Product+Inquiry& Message=I+have+some+questions+about+your+products.&Phone=123-456-7890& Company=Adobe+Inc.&Country=United+States&PreferredContactMethod=Email& SubscribeToNewsletter=true' \ https://main--portal--wkndforms.hlx.live/contact-us
次に、「ありがとうございます」メッセージをカスタマイズできます。