Shopify Flow から HTTP リクエストを送信してください。

Shopify Flow から HTTP リクエストを送信してください。

ページをコピーする

動画付きステップバイステップガイド:Workflow Transactional Email を使用して、Shopify Flow から外部 API を呼び出す方法(Shopify Basic を含む)。実際に動作する Airtable のサンプル。

HTTPリクエストにこれを使う理由

Shopify Flow 「HTTPリクエストの送信」アクションが組み込まれていますが、これは特定のShopifyプランでのみご利用いただけます。お使いのストアが「Basic」プランの場合でも、代わりにWorkflow Transactional Emailを使用することで、外部APIを呼び出すことができます。

アプリ内でリクエストを一度作成し、ワークフロー内で「HTTPリクエスト」アクションを使用してそのリクエストを選択します。リクエストをワークフローではなくアプリ内に保持することで、Shopify Flowの設定に認証情報が保存されることがなくなり、リクエストとレスポンスのログをすべて無料で取得できるようになります。

作成する内容

10分ごとに実行され、Airtableにまだ登録されていない商品を探し出し、Airtableに送信するワークフローです。

これには以下のものが使用されています:

  • AirtableのトークンとベースIDを保持するための秘訣
  • リクエストテンプレートを定義するためのHTTPリクエスト
  • Shopify Flow内の「HTTPリクエスト」アクションを実行するには、次のようにします。
  • 結果を確認するための履歴

動画ガイド

全体の流れ:シークレットの作成、HTTPリクエスト、そしてワークフローについてです。この動画には音声がありません。

始める前に

  • Workflow Transactional Email がインストールされています。
  • Shopify Flow をご利用いただけます。
  • AirtableのベースIDと、製品データを受け入れる準備が整ったテーブルをご用意ください。
  • のAirtableアクセストークン()をお持ちで、適切な権限が付与されています。

手順 1:認証情報をシークレットとして保存する

リクエストに認証情報を入力するのではなく、一度「シークレット」として保存し、{{ secrets.yourKeyName }} として参照するようにしてください。これらは保存時に暗号化され、リクエスト間で再利用可能であり、履歴からは削除されます。

「Open **Secrets」**を開き、「**秘密を作成」**をクリックしてください。

「シークレット」ページ(「シークレットの作成」ボタンあり)

キー、値、および説明を入力し、保存してください。

秘密鍵、値、説明の入力

この例では、2つのシークレット(個人アクセストークンとAirtableベースID)がストアされています。

ステップ2:リクエストを作成する

この例では、および Airtable の create-records エンドポイント を使用しています。

「HTTPリクエスト」を開き、「リクエストを作成」をクリックしてください。

「HTTPリクエスト」ページ(「リクエストを作成」ボタン付き)

「Airtableの製品レコードを作成」など、わかりやすい名前を付けてください。これは、後でShopify Flow内で検索する際のキーワードとなります。

メソッドを設定してください。Airtableのレコードを作成する場合は、POSTです。

URLフィールドにエンドポイントを入力してください。「https://」というプレフィックスは固定されていますので、残りの部分を入力してください:

api.airtable.com/v0/{{ secrets.airTableProductsBaseId }}/Products

この画像は、Airtableのエンドポイントがベースにどのように対応しているかを示しています。ご自身の環境に合わせて調整してください:

AirtableのエンドポイントURLが、ベース「」にどのように対応しているか

Airtableで必要なヘッダーを追加してください:

Authorization: Bearer {{ secrets.airtableAccessToken }}
Content-Type: application/json

リクエスト本文では、レコードに変数を指定して、Shopify Flowがそれらを提供できるようにしてください:

{
  "records": {{ variables.records }}
}

Airtableでは、その変数が次のような形状の配列として解決されると想定しています:

"records": [
  {
    "fields": {
      "Title": "Classic White T-Shirt",
      "Handle": "classic-white-tshirt",
      "Product ID": 1001
    }
  },
  {
    "fields": {
      "Title": "Eco-Friendly Water Bottle",
      "Handle": "eco-water-bottle",
      "Product ID": 1002
    }
  }
]

次のステップで、その配列をワークフロー内に作成します。

完成したリクエストは、次のようになります:

完了したAirtableのHTTPリクエスト

「HTTPリクエスト」ページには、保存されたリクエストとそのメソッドおよびURLが一覧表示されています
「HTTPリクエスト」には、保存されたすべてのリクエストが一覧表示されます。「リクエストを作成」をクリックすると、新しいリクエストが開始されます。
メソッド、URL、ヘッダー、およびボディを備えたHTTPリクエストエディタ
リクエスト:メソッド、URL、ヘッダー、およびボディ。それぞれに変数やシークレットを使用できます。

リクエストを保存してください。これで、Shopify Flowの「**HTTPリクエスト」**アクションから選択できるようになりました。

ステップ3:ワークフローを構築する

Shopify Flow を開き、新しいワークフローを作成してください。

スケジュールに基づくトリガーを選択してください。この例では、デモンストレーションのため10分ごとに実行されますが、本番環境では適切な間隔を設定してください。

Shopify Flowのスケジュールされたトリガー

Airtableにまだ登録されていない商品を取得します。すでに送信済みの商品には、最終ステップで「added-to-airtable」というタグが付与されるため、このクエリではそれらを除外します。Shopifyの「」クエリ引数のリファレンス()をご参照ください。

Shopify Flowでタグが付けられていない商品を取得する

それでは、データを整形しましょう。リクエスト本文にはrecords変数が指定されているため、Shopify Flowの「**コードを実行」**アクションを使用して、取得した商品をその配列の形式に整えてください。

「コードを実行」アクションの追加

このステップは、次のように設定してください:

「コードの実行」ステップの設定

クエリ:

query {
  getProductData {
    id
    handle
    title
  }
}

コード:

export default function main(input) {
  const records = input.getProductData.map((data) => {
    const numericId = parseInt(data.id.replace("gid://shopify/Product/", ""));
    return {
      fields: {
        "Product ID": numericId,
        "Title": data.title,
        "Handle": data.handle
      }
    };
  });

  return {
    records: JSON.stringify(records)
  };
}

出力スキーマ:

"The output of Run Code"
type Output {
  "The message returned by the script"
  records: String
}

右側で結果のプレビューをご覧いただけます:

「コードの実行」の出力をプレビューする

このアプリが提供する「**HTTPリクエスト」**アクションを追加してください。

HTTPリクエストアクションの追加

プロンプトが表示されたら、保存しておいたリクエスト「Airtableの製品レコードを作成」を選択し、保存してからワークフローに戻ってください。

保存されたHTTPリクエストの選択

アクションの「変数」フィールドに、先ほどフォーマットしたレコードを渡してください:

{
  "records": "{{runCode.records}}"
}

フォーマット済みのレコードをリクエストに渡し

最後に、取得した商品を順に処理し、added-to-airtable のタグを付けます。これにより、次回の実行時にこれらの商品が再度取得されるのを防ぎます。

を送信した後の商品のタグ付け

ワークフローを保存して有効にしてください。

ステップ4:正常に動作したことを確認します

**「履歴」**では、リクエストが成功したかどうか、およびAirtableからどのような応答が返ってきたかを確認できます。

リクエスト「」が表示された履歴一覧

そのエントリを開いて、リクエストデータ、レスポンスデータ、およびタイミングを確認してください。

リクエストの詳細画面

リクエストの編集ページにある「リクエスト履歴」ボタンをクリックすると、そのリクエストに絞り込まれた履歴ページに直接移動します。

このアプリでは、以下の番号には電話をかけることができません

マーチャントが設定したリクエストには、安全対策が適用されます。内部ネットワークまたはプライベートネットワークのアドレスへのリクエストは拒否されます。これには、localhost、クラウドメタデータエンドポイント、およびプライベート範囲に解決されるすべてのアドレスが含まれます(リダイレクトを経由する場合でも同様です)。SSRF blocked に関するエラーが表示された場合、その宛先は当該リストに含まれています。 また、リクエストは最大 5 回のリダイレクトまで追跡され、レスポンスサイズは 10 MB に制限されます。

Shopify Flow この機能自体、アクションのレスポンスサイズを50 KBに制限しています。テストのレスポンスがこれを超える場合、アプリはライブワークフロー内でそのステップが失敗するのを許すのではなく、保存をブロックします。

ベストプラクティス

  • Shopify Flowで簡単に見つけられるよう、わかりやすいリクエスト名を使用してください。
  • APIトークンは、ヘッダーに入力するのではなく、シークレットとして保存してください。
  • 体の意識を、目的地が実際に必要とする分野に集中させてください。
  • 変更を行った後は、履歴を確認し、リクエストが依然として正常に処理されていることをご確認ください。
  • リクエストの前に条件を追加し、空のサイクルでは実行されないようにしてください。

関連情報