Use Kinde as authentication provider for Shopify store

Use Kinde as the authentication provider for your Shopify store’s customer accounts. Shopify’s third-party identity provider lets customers sign in to your store through Kinde, so you control sign-in methods, branding, and user management in one place.

This guide walks you through connecting Kinde to Shopify using OpenID Connect. It also covers the legacy Shopify Multipass integration for stores that still rely on that approach.

What you need

Link to this section

• A Kinde account with Admin or Engineer permissions (sign up for free)
• A Shopify Plus account

Connect Kinde to Shopify

Link to this section

1. Create a Kinde app and get app keys

Link to this section

1. Sign in to your Kinde dashboard and select Add application
2. Enter a name for your app (for example, “Shopify”), select Back-end web, then select Save
3. Select Other back end and select Save
4. Go to the Details page and copy the Domain (or your custom domain), Client ID, and Client secret
5. Go to the Authentication page and enable the sign-in methods you want (for example, Google, Apple, or Facebook)
6. Select Save.

2. Configure Shopify

Link to this section

1. Sign in to your Shopify account and go to Settings > Customer accounts > Third-party identity provider

2. Enter Discovery URL:

   <YOUR_DOMAIN>/.well-known/openid-configuration

   Replace <YOUR_DOMAIN> with your custom domain (e.g., https://auth.yourbusiness.com) or Kinde domain (e.g., https://your_business.kinde.com)

3. Enter the Client ID and Client secret you copied from the Kinde app.

4. Optional: In the Additional scopes field, add offline to enable refresh token support.

   Kinde uses the offline scope instead of offline_access as defined in the OIDC specification.

5. Select Save.

6. Copy the Shopify callback URL. You will need it in the next step.

3. Add Shopify callback URL to Kinde

Link to this section

1. In Kinde, go to Settings > Environment > Applications
2. Select View details for the application you created for Shopify
3. On the Details page, scroll to the Callback URLs section
4. Add the Shopify callback URL to Allowed callback URLs
5. Select Save

4. Test the connection

Link to this section

1. Open your Shopify store and start the sign-in process.
2. You are redirected to your Kinde sign-in page.
3. Sign up with a test account. You should be redirected back to your Shopify store.
4. In your Kinde dashboard, go to Users to confirm the test account was created.

Shopify Multipass (legacy)

Link to this section

Shopify no longer recommends Multipass for new integrations. The steps below are kept here for legacy stores that still depend on Multipass to sign customers into Shopify from an external application.

This example uses Next.js, but you can configure Multipass in other languages and frameworks.

1. Install project dependencies

Link to this section

npm

npm i multipass-js @kinde/jwt-decoder

pnpm

pnpm add multipass-js @kinde/jwt-decoder

yarn

yarn add multipass-js @kinde/jwt-decoder

bun

bun add multipass-js @kinde/jwt-decoder

2. Add environment variables

Link to this section

Add Shopify and Multipass settings to your .env file.

.env

SHOPIFY_MULTIPASS_SECRET=<your-multipass-secret>
SHOPIFY_STORE_URL=<your-shopify-store-url>

3. Set up API endpoint

Link to this section

Create an endpoint file—for example, app/api/multipass/route.tsx—and add the following code:

Replace the placeholder values with your domain and Multipass secret.

app/api/multipass/route.tsx

import { NextResponse } from "next/server";
import { jwtDecoder, type JWTDecoded } from "@kinde/jwt-decoder";
import { cookies } from "next/headers";
import { Multipass } from "multipass-js";

export async function GET() {
  const decodedToken = jwtDecoder<JWTDecoded & {email: string}>(cookies().get("id_token")?.value);

  if (decodedToken) {
    const multipass = new Multipass(process.env.SHOPIFY_MULTIPASS_SECRET as string);

    const customerData = {
      // Required
      email: decodedToken?.email,
      created_at: decodedToken?.iat
      // add additional fields here
    };

    const url = multipass
      .withCustomerData(customerData)
      .withDomain(process.env.SHOPIFY_STORE_URL as string)
      .url();

    return NextResponse.redirect(url, 302);
  } else {
    const params = new URLSearchParams();
    params.append("post_login_redirect_url", `${process.env.KINDE_SITE_URL}/api/multipass`);
    return NextResponse.redirect(
      `${process.env.KINDE_SITE_URL}/api/auth/login?${params.toString()}`,
      302
    );
  }
}

Shopify Multipass is now configured with Kinde.

When you redirect users to /api/multipass, the endpoint generates a Multipass token and redirects them to your Shopify store, signed in.