reCAPTCHAを追加する

メールフィールドのある公開フォームは、ボットの標的になります。Google reCAPTCHAは、実際のお客様の妨げにならないようにしながら、自動送信のほとんどを防ぐチェックを追加します。アプリでは「reCAPTCHA offers more than just spam protection」と説明されています。

設定は2つの作業です。Googleにストアを登録し、Googleから発行されたキーをアプリに追加します。Googleアカウントが必要です。

注意

reCAPTCHA v2の「I’m not a robot」チェックボックスで登録してください。 この連携はこのバージョン向けに作られています。v3は目に見えない形で動作し、異なる種類のキーが発行されるため、v3のキーペアをアプリに貼り付けても、フォームにチェックが表示されず、保護も働きません。バージョンは登録時にGoogleが決定するため、後から気づくのではなく、登録フォームで正しく選択してください。

ステップ1 — Googleからキーを取得する

1. reCAPTCHA管理コンソールを開く

   Google reCAPTCHAにアクセスし、Googleアカウントでログインします。

   アプリ内からもアクセスできます。Google reCAPTCHAページには「Click here to create your own reCAPTCHA site key and secret key for your website」という一文があり、hereは同じコンソールへのリンクです。

2. 登録フォームに入力する

   Googleでは5つの項目を入力します。2番目の項目が、正しく動作するかどうかを左右します。

   項目	入力する内容
   Label	1年後に見返したときに、どのサイト用のキーかわかる名前。ストア名が最も分かりやすい選択です。
   reCAPTCHA type	reCAPTCHA v2を選び、その下の"I'm not a robot" Checkboxオプションを選択します。v3、非表示バッジ、Androidのオプションは選ばないでください。
   Domain	Shopifyストアのドメイン。見積もりフォームが表示されるアドレスです。
   Owners	そのままにします。Googleがログインしたアカウントを設定します。同僚にもキーを管理させたい場合のみ、アドレスを追加してください。
   Alerts	オンにすることをおすすめします。reCAPTCHAの設定ミスや不審なトラフィックの増加など、サイトで問題が見つかった場合に、Googleがオーナーにメールで通知します。前者はまさにこのページで扱う不具合なので、お客様に指摘されるのを待たず、Googleに知らせてもらいましょう。

   すべて正しく入力して、フォームを送信します。

3. 2つのキーをコピーする

   Googleが、サイトキーとシークレットキーのペアを表示します。このページは開いたままにしてください。すぐあとで、同じ名前のフィールドにどちらもアプリに貼り付けます。

ノート

登録するドメインは、お客様が見積もりフォームにアクセスするときに実際に閲覧しているドメインと一致している必要があります。両者の不一致が、チェックが表示されない最も多い原因です。

ステップ2 — アプリにキーを追加する

1. 連携設定を開く

   アプリでAdvanced settingsに移動し、Integrationsタブを開きます。Third-party integrationの下にあるGoogle reCAPTCHAを見つけて開きます。各連携には、それぞれ専用のページがあります。

2. キーを貼り付ける

   ページにはフィールドが2つだけ、上下に並んでいます。

   アプリのフィールド	入力する内容
   Site key	Googleが発行したサイトキー。ペアのうち公開されるほうです。
   Secret key	Googleが発行したシークレットキー。ペアのうち非公開のほうです。他の場所に貼り付けたり、チーム外に共有したりしないでください。

   Googleの2つのキーはアプリと同じ名前なので、そのままコピーして貼り付けます。2つのキーは互換性がなく、入れ替えてしまうミスが最も多く見られます。両方をコピーして記憶に頼るのではなく、1つコピーして貼り付けてから、もう1つを取りに戻ってください。

   

   

   Googleの両方のキーを貼り付けて、保存します。

3. 保存して、ストアフロントで結果を確認する

   変更を保存し、お客様と同じようにストアフロントで見積もりフォームを開きます。フォームに**“I’m not a robot”**チェックボックスが表示されるはずです。

   実際にテスト用の依頼を送信してください。チェックボックスが表示されるだけでは、サイトキーが機能していることしか確認できません。送信が完了して初めて、シークレットキーも機能していることが確認できます。

ノート

保存したキーは、ページを開き直すとマスクされて表示されます。アプリは連携キーを再表示せず、マスクされたプレースホルダーとして保存するためで、正常な動作です。キーを変更したいときだけ、新しいキーを貼り付けてください。

注意

キーを変更するたびに、実際に送信してテストしてください。設定に誤りがあると、正規のお客様を気づかないうちにブロックしてしまうことがあり、届かなかった依頼は確認できません。

チェックが表示されない場合

• v3ではなくv2で登録したか確認してください。 v3のキーペアでは、チェックボックスは表示されません。v3はそういう仕組みだからです。Google reCAPTCHAコンソールでサイトを開き、登録されているタイプを確認してください。v3になっている場合は、v2の「I’m not a robot」Checkboxで新しいサイトを登録し、両方のキーを置き換えます。
• ドメインが一致しているか確認してください。 Googleに登録したドメインは、お客様が実際に使用するドメインと一致している必要があります。
• 両方のキーが、正しい組み合わせで保存されているか確認してください。 アプリのSite keyフィールドにはGoogleのサイトキー、Secret keyフィールドにはGoogleのシークレットキーを入力します。不安な場合は、Googleから貼り付け直して保存してください。
• テーマでアプリがオンになっているか確認してください。 アプリのダッシュボードのSetup guideに、App embed is enabledまたはApp embed is disabledとEnable app embedボタンが表示されます。
• フィールドがロックされていないか確認してください。 グレー表示で、鍵アイコン付きで「🔐 This feature is available on …」と表示されている場合、その連携は上位プランのものです。不具合ではなくプランによる制限なので、アプリのPricing plansを開いてください。

次のステップ

• 標準フォームを作成する — フォームのその他の部分
• 連携の概要 — 見積もりデータを他のツールに連携します
• ファイルのアップロードを許可する — アプリが受け付けるファイル形式と、アップロードで使用するストレージ