Skip to main content

Customer account
object

The authenticate.public.customerAccount function ensures that customer account extension requests are coming from Shopify, and returns helpers to respond with the correct headers.

Authenticates requests coming from Shopify customer account extensions.

Request
required

Promise<>
Was this section helpful?

Authenticate and return offers for the customer

import type {ActionFunctionArgs, LoaderFunctionArgs} from '@remix-run/node';
import {json} from '@remix-run/node';

import {authenticate} from '../shopify.server';
import {getOffers} from '../offers.server';

// The loader responds to preflight requests from Shopify
export const loader = async ({request}: LoaderFunctionArgs) => {
await authenticate.public.customerAccount(request);
};

export const action = async ({request}: ActionFunctionArgs) => {
const {cors, sessionToken} = await authenticate.public.customerAccount(request);

// Get offers for the customer
const offers = getOffers(sessionToken.des, sessionToken.sub);
return cors(json({offers}));
};

Anchor to example-setting-cors-headers-for-a-public-requestSetting CORS headers for a public request

Use the cors helper to ensure your app can respond to customer account extension requests.

Was this section helpful?

Setting CORS headers for a public request

app/routes/public/my-route.ts

import { LoaderFunctionArgs, json } from "@remix-run/node";
import { authenticate } from "../shopify.server";
import { getMyAppData } from "~/db/model.server";

export const loader = async ({ request }: LoaderFunctionArgs) => {
const { sessionToken, cors } = await authenticate.public.customerAccount(
request,
{ corsHeaders: ["X-My-Custom-Header"] }
);
const data = await getMyAppData({shop: sessionToken.dest});
return cors(json(data));
};

Get store-specific data using the sessionToken object.

Was this section helpful?

Using the decoded session token

app/routes/public/my-route.ts

import { LoaderFunctionArgs, json } from "@remix-run/node";
import { authenticate } from "../shopify.server";
import { getMyAppData } from "~/db/model.server";

export const loader = async ({ request }: LoaderFunctionArgs) => {
const { sessionToken } = await authenticate.public.customerAccount(
request
);
return json(await getMyAppData({shop: sessionToken.dest}));
};