Custom Headless Storefronts

Managing Customers

This section covers different ways to associate customers to headless carts.

Customer login using GraphQL

You can sign in a customer account using client-side or server-side code.

Client-side GraphQL customer login

To sign in a customer account with an email address and a password in client-side code, use the following GraphQL Storefront API customer login mutation.

Customer login mutation

mutation Login($email: String!, $pass: String!) {
  login(email: $email, password: $pass) {

When a customer is logged in using the customer login mutation, subsequent queries made to the GraphQL Storefront API will return customer-specific results (for example, customer group pricing) using the context of the logged in customer.

Server-side GraphQL customer login

To make queries from the perspective of a particular customer in headless or server-side code, use customer impersonation tokens.

When you use customer impersonation tokens to authenticate requests made to the GraphQL Storefront API, the tokens receive store information from the perspective of the customer corresponding to the customer ID passed in the X-Bc-Customer-Id header of the POST request. Pricing, product availability, customer account, and customer details will be reflected.

Customer Single Sign-on

If a customer signs in to your headless storefront, and then is redirected to a BigCommerce-hosted page, you can use the Customer Login API to create a single sign-on experience between your headless storefront and BigCommerce. Doing so will make the redirection from the headless storefront to BigCommerce a more seamless experience for the customer.

You can sign a customer in to an embedded checkout by setting redirect_to in the Customer Login JWT payload to the relative path of the embedded_checkout_url generated using the Carts API.

JWT payload example

  "iss": {{CLIENT_ID}},
  "iat": 1535393113,
  "jti": {{UUID}},
  "operation": "customer_login",
  "store_hash": {{STORE_HASH}},
  "customer_id": {{CUSTOMER_ID}},
  "channel_id": {{CHANNEL_ID}},
  "redirect_to": "/cart.php?embedded=1&action=loadInCheckout&id=bc218c65-7a32-4ab7-8082-68730c074d02&token=aa958e2b7922035bf3339215d95d145ebd9193deb36ae847caa780aa2e003e4b",
  "request_ip": "111.222.333.444"

Identifying signed-in customers

If a customer signs in to a BigCommerce-hosted cart or checkout, then navigates back to the headless storefront, you will need to confirm the customer's identity before revealing sensitive information. To address this need, BigCommerce provides the Current Customers API accessible via client-side JavaScript. The Get Current Customer endpoint returns a JWT (signed with your OAuth client secret) that contains customer details.

Surfacing customer group pricing

When querying the GraphQL Storefront API, customer-specific pricing will be reflected in query results if the request is made using a customer impersonation token.

For server-side REST implementations, you can use the Pricing API to get prices for a particular customer group.

Example request: Get Prices
Accept: application/json
Content-Type: application/json
X-Auth-Token: {{ACCESS_TOKEN}}
  "channel_id": 1,
  "currency_code": "USD",
  "customer_group_id": 0,
  "items": [
      "product_id": 0,
      "variant_id": 0,
      "options": [
          "option_id": 0,
          "value_id": 0

Next step

Did you find what you were looking for?