@shopify/gate-context-client

The gate-context-client package provides an abstract interface to read and write gate context information. The client writes gate context information for use by Shopify functions. For example, the client could write a signed message to the context. That message could be validated and processed by a Shopify function in order to apply discounts or block checkout.

Installation

Install the shopify/gate-context-client package.

yarn add @shopify/gate-context-client

Documentation

See the Tokengating example app tutorial for further documentation. Specifically, the end of the Show gates on the storefront using a theme app extension part about writing an HMAC.

Code example

interface Input {
  walletAddress: string;
  walletVerificationMessage?: string;
  walletVerificationSignature?: string;
}

const client = getGateContextClient(
  backingStore: 'ajaxApi',
);

async function run(data: Input) {
  try {
    await client.write(data)
  } catch(error) {
    console.error('Error writing to GateContext', error);
  }
}

Backends

The client is intended to abstract backend details and automatically choose the correct backend where possible. For example, for the Online store channel, the Cart Ajax API will be used. The Cart Ajax API is the only supported backend right now.

Cart Ajax API

For the Cart Ajax API, the data will be written to a special cart attribute called _shopify_gate_context as a JSON string. The client implementation for this backend will automatically serialize and deserialize the value as needed.

After writing via the client and inspecting the cart, via /cart.js, you'd see something like the following:

{
  "token": "111f",
  "attributes": {
    "_shopify_gate_context": "{\"attribute1\": 123}"
  },
  ...
}

shopifyGateContextGenerator

This is an async transformation function that will get called before the write to the backend occurs, and may be used to override the written value.

interface Input {
  walletAddress: string;
  walletVerificationMessage?: string;
  walletVerificationSignature?: string;
}

const client = getGateContextClient({
  backingStore: 'ajaxApi',
  // adds an additional key before writing
  shopifyGateContextGenerator: (data: Input) => {
    const {walletAddress} = data;
    // async call using walletAddress
    return Promise.resolve({...data, extraKey: ''});
  },
});

async function run(data: Input) {
  try {
    await client.write(data);
  } catch (error) {
    console.error('Error writing to GateContext', error);
  }
}

Contributing

Pull requests are welcome. See the contribution guidelines for more information.

License

MIT © Shopify, see LICENSE.md for details.