ワーカー変数

Zarazワーカー変数は、設定してアクションやトリガーで使用できる強力なタイプの変数です。文字列やマスクされた変数とは異なり、ワーカー変数は動的です。これは、Cloudflareワーカーを使用して変数の値を決定できることを意味し、無限の目的に使用できます。例えば：

カート内のすべての商品の合計を計算するワーカー変数
クッキーを取得し、バックエンドにリクエストを送り、ユーザーIDを返すワーカー変数
第三者ベンダーに送信する前に値をハッシュ化するワーカー変数

ワーカーの作成

ワーカー変数を使用するには、まず新しいCloudflareワーカーを作成する必要があります。これはCloudflareダッシュボードを通じて、またはWranglerを使用して行うことができます。

Cloudflareダッシュボードで新しいワーカーを作成するには：

Cloudflareダッシュボード ↗にログインします。
Workers & Pagesに移動し、アプリケーションを作成を選択します。
ワーカーに名前を付け、デプロイを選択します。
コードを編集を選択します。

これで「Hello world」と応答する基本的なワーカーが作成されました。このワーカーを変数として使用すると、変数は常に「Hello world」を出力します。ワーカーからの応答ボディがワーカー変数の値になります。このワーカーを有用にするためには、通常、Zarazからの情報を使用したいと思います。これをZarazコンテキストと呼びます。

Zarazは、ZarazコンテキストオブジェクトをPOSTリクエストのJSONペイロードとしてワーカーに転送します。次のようにして任意のプロパティにアクセスできます：

const { system, client } = await request.json()

/* システムパラメータ */
system.page.url.href // 現在のページのURL
system.page.query.gclid // gclidクエリパラメータの値
system.device.resolution // デバイスの画面解像度
system.device.language // ブラウザの優先言語

/* Zarazトラック値 */
client.value // `zaraz.track("foo", {value: "bar"})`からの値
client.products[0].name // eコマースコールの最初の商品の名前

さまざまなユースケースの完全な例については、引き続きお読みいただくか、Zarazコンテキストを参照してください。

ワーカー変数の設定

ワーカーが公開されたら、ワーカー変数の設定は簡単です。

Cloudflareダッシュボード ↗にログインします。
Zaraz > ツール設定 > 変数に移動します。
変数を作成をクリックします。
変数に名前を付け、変数タイプとしてワーカーを選択し、新しく作成したワーカーを選択します。
変数を保存します。

ワーカー変数の使用

ワーカー変数が設定されたので、アクションやトリガーで使用できます。

ワーカー変数を使用するには：

Cloudflareダッシュボード ↗にログインし、アカウントとドメインを選択します。
Zaraz > ツール設定 > ツールに移動します。
すでに設定したツールの横にある編集をクリックします。
アクションを選択するか、新しいアクションを追加します。
テキストフィールドの右側にあるプラス記号をクリックします。
リストからワーカー変数を選択します。

例：ワーカー変数

カート内のすべての商品の合計を計算

カート内の商品のリストを送信していると仮定します。次のように：

zaraz.ecommerce("Cart Viewed", {
  products: [
    { name: "shirt", price: "50" },
    { name: "jacket", price: "20" },
    { name: "hat", price: "30" },
  ],
});

合計を計算するには、次のようにします：

export default {
  async fetch(request, env) {
    // Zarazコンテキストオブジェクトを解析
    const { system, client } = await request.json();

    // すべての価格の配列を取得
    const productsPrices = client.products.map((p) => p.price);

    // 合計を計算
    const sum = productsPrices.reduce((partialSum, a) => partialSum + a, 0);

    return new Response(sum);
  },
};

バックエンドのユーザーとクッキーを照合

Zarazは、すべてのクッキーを自動的にsystem.cookiesオブジェクトの下に公開するため、常に利用可能です。クッキーにアクセスし、それを使用してバックエンドをクエリするのは次のようになります：

export default {
  async fetch(request, env) {
    // Zarazコンテキストオブジェクトを解析
    const { system, client } = await request.json();

    // "login-cookie"のクッキーの値を取得
    const cookieValue = system.cookies["login-cookie"];

    const userId = await fetch("https://example.com/api/getUserIdFromCookie", {
      method: POST,
      body: cookieValue,
    });

    return new Response(userId);
  },
};

第三者ベンダーに送信する前に値をハッシュ化

ハッシュ化したい値、例えばメールアドレスを送信していると仮定します：

zaraz.track("user_logged_in", { email: "user@example.com" });

このプロパティにアクセスしてハッシュ化するには、次のようにします：

async function digestMessage(message) {
  const msgUint8 = new TextEncoder().encode(message); // (utf-8) Uint8Arrayとしてエンコード
  const hashBuffer = await crypto.subtle.digest("SHA-256", msgUint8); // メッセージをハッシュ化
  const hashArray = Array.from(new Uint8Array(hashBuffer)); // バッファをバイト配列に変換
  const hashHex = hashArray
    .map((b) => b.toString(16).padStart(2, "0"))
    .join(""); // バイトを16進数文字列に変換
  return hashHex;
}

export default {
  async fetch(request, env) {
    // Zarazコンテキストオブジェクトを解析
    const { system, client } = await request.json();

    const { email } = client;

    return new Response(await digestMessage(email));
  },
};

Cloudflare Dashboard Discord Community Learning Center Support Portal

Cookie Settings