ShopifyをShopify Flowに接続する方法

Shopify このプリセットは、ご自身のアプリのAPIシークレットを使用して、独自のWebhookやアプリ間呼び出しに署名を行います。 このプリセットを使用すると、別のShopifyストアやご自身のアプリからのWebhookを受信し、Shopifyのドキュメントに記載されている方法と全く同じ方法でその正当性を確認することができます。Workflow Webhooksは、その呼び出しをShopify Flowのトリガーに変換するため、ストア側でそれに応じて処理を行うことが可能です。お客様へのタグ付け、注文メモの追加、社内メールの送信、メタフィールドの更新など、Shopify Flowで可能なあらゆる操作を実行できます。

このガイドでは、Shopify が送信し、Workflow Webhooks が受信・検証し、Shopify Flow が処理を行うという一連の流れをすべて設定します。すべてのリクエストにおいて、Shopify の HMAC 署名が確認されるため、Shopify 以外からはワークフローを開始することはできません。

どのようなものを作れるか

  • 別のShopifyストアからの注文を、こちらのストアに反映させてください。お客様にタグを付けたり、メモを追加したり、フルフィルメントワークフローを開始したりできます。
  • Shopify Flow自体がトリガーとして提供していないトピックに対して、ご自身のアプリからそのトピックを購読することで、Shopify Flow内で反応させることができます。
  • ミドルウェアサービスを開発することなく、卸売ストアと小売ストアの業務を連携させます。

送信される代表的なイベントは、orders/create、products/update、customers/create、fulfillments/create などです。

始める前に

  • Workflow Webhooks Shopifyストアにインストールされています。
  • Shopify Flow インストール済みです。これは、ShopifyのApp Storeから無料で入手できます。
  • Shopify のアカウントで、Webhook を作成する権限があるもの。

ステップ 1 - Workflow Webhooks で Webhook を作成します

  1. Workflow Webhooks を開き**、[Webhook] → [Create Webhook]** の順に選択し、Shopify Flow で識別しやすい名前(例:Shopify events)を付けます。
  2. **「認証」**で、「**HMAC」**を選択してください。
  3. 「署名プロバイダー」で、「Shopify」を選択してください。アプリがヘッダー、アルゴリズム、署名付きペイロード、リプレイウィンドウを自動的に入力してくれます。これ以外に設定する必要はありません。
  4. 「シークレット」の欄は、ひとまず空のままにして、**「保存」**をクリックしてください。ページに表示されているWebhookのURLをコピーしてください。

その他の認証モードについては、認証 を、Shopify Flow に送信するフィールドの選択については、ペイロードのマッピングとShopify Flow変数 をご参照ください。

ステップ 2 - 「Shopify」にエンドポイントを追加します

コピーしたURLを使用して、送信元のストアまたはアプリでWebhookのサブスクリプションを作成し、そのアプリのAPIシークレットで署名してください。

Shopifyの署名用シークレットを確認する方法

アプリのAPIシークレット/Webhookの署名用シークレットです。

ShopifyのWebhook署名に関する公式ドキュメント には、お客様のアカウントに関する正確な説明文とスクリーンショットが掲載されています。

そのシークレットを、Workflow Webhooks の Webhook の**「Secret」**フィールドに貼り付けて、保存してください。それ以降、Shopify からのすべての配信は、Shopify Flow に届く前に検証されるようになります。

これで何が確認されるのか

何 値
署名ヘッダー X-Shopify-Hmac-Sha256
署名の位置 ヘッダーの値全体
何が署名されたのでしょうか {body}
署名 HMAC-SHA256、Base64エンコード済み
タイムスタンプ この送信者には使用されていません
リプレイ防止機能 なし - この送信者はタイムスタンプに署名を行わないため、すべての有効な署名は引き続き有効です
その秘密 プレーンテキストとして使用します。送信者が表示しているとおりに、そのまま貼り付けてください。

署名付きペイロードにおいて、{body} は、バイト単位でリクエスト本文の生のデータそのものです。

これらのいずれかの条件を満たさないリクエストは、401 のエラーで拒否され、沿革とトラブルシューティング に記録され、ワークフローは開始されません。

ステップ 3 - 「Shopify Flow」ワークフローを構築する

  1. Shopify Flow でワークフローを作成し、「Workflow Webhooks」トリガーを選択してください。
  2. 「**イベントの記録」**をクリックし、Shopify からテストイベントを送信してください(または、Workflow Webhooks で「**テストを送信」**をご利用ください)。これにより、Shopify Flow がデータの構造を学習します。
  3. 所有しているすべてのWebhookは同じShopify Flowトリガーを起動するため、このワークフローの対象をShopifyに限定するために、Webhook IDを条件とする最初の条件を追加してください。IDはWebhookページに表示されています。
  4. アクションを追加しましょう――お客様にタグを付けたり、メモを追加したり、社内メールを送信したり、メタフィールドを更新したりできます。
Shopify Flow
Shopify Flowで「トリガーを選択」を選び、Workflow Webhooksを開き、「Webhookトリガー」を選択してください。
Shopify Flow の条件:Webhook ID が特定の Webhook の ID と一致する
すべてのワークフローの最初のステップは、Webhook ID に基づく条件設定です。これにより、この Webhook に対してのみワークフローが実行されるようになります。
完成したワークフロー:Webhookトリガー、Webhook IDに基づく条件、そして「True」分岐で内部メールを送信します
完成したワークフローは、トリガー、Webhook IDを条件とし、Trueの分岐でアクションを実行するという流れになります。

ステップ4 - エンドツーエンドでテストを行う

Shopify で実際のイベントをトリガーしてください。Workflow Webhooks → History には**、ステータスが「Success」**の呼び出しが表示されるはずです。署名が正しくない場合は、その理由が記載された失敗のエントリが表示されます。また、署名付きWebhookの検証 では、どのステップで失敗したかを正確に示す署名テスターについて解説されています。

「History」に、リクエストヘッダー、ペイロード、ステータス、所要時間、および識別子を含む1つの呼び出しが開かれました
「History」で配信されたイベント:ステータスが「Success」の場合、Shopify Flowがそれを受け入れたことを意味します。
署名が一致しません▾

順に、シークレット(最も一般的な原因は、余分なスペースや、間違った環境のキーの使用です)、送信者が別のエンドポイントのシークレットを使用しているかどうか、そしてShopifyとアプリの間でボディが書き換えられているかどうかです。署名は生のバイト列を対象としているため、JSONのフォーマットを変更するプロキシによって署名が破綻してしまいます。 Webhookページの署名テスターには、署名された正確なテキストが表示されます。

どのリクエストでも401エラーが表示されます▾

Webhookの認証設定が**「HMAC」**に設定され、「Shopify」プロバイダーが選択されていること、シークレットが入力されていること、そしてShopifyが、アプリに表示されているURL(末尾のコードを含む)に正確にPOSTリクエストを送信していることをご確認ください。

「履歴」には何も表示されません▾

リクエストは届きませんでした。Shopify で URL を再確認し、Shopify 自身の配信ログで受信した応答をご確認ください。「404」というエラーは、Webhook が間違っているか削除されていることを意味します。「429」というエラーは、プランの呼び出し制限を超えていることを意味します。詳細は プランと利用方法 をご覧ください。

ワークフローが、本来の対象とは異なるイベントに対して実行されてしまいます▾

ストア内のすべてのWebhookは、同じShopify Flowトリガーを起動します。ワークフローの最初のステップとして、Webhook IDに基づく条件を追加するか、Shopifyから送信するイベントを絞り込んでください。

関連情報