# Setup Customer Account API

Requirements:

* You have Apps and channels permissions on the Shopify store that you're working with.
* You have installed the Headless or Hydrogen sales channel from the Shopify App Store.

### **Step 1: Enable Customer Account API access**

1. To use the Customer Account API, you first need to enable it and get your access credentials.
2. From your Shopify admin, under **Sales channels**, click **Headless** or **Hydrogen**.
3. Select your storefront.
4. Complete one of the following steps:

If you selected **Headless**, then navigate to **Customer Account API settings**.

<figure><img src="/files/1iDcRawXyra4uXaEWWT1" alt=""><figcaption></figcaption></figure>

If you selected **Hydrogen**, then navigate to **Storefront settings**.

<figure><img src="/files/JPGv8V978V3zUuD2CLSc" alt=""><figcaption></figcaption></figure>

From the Credentials section, copy the client ID (and client secret, if applicable) to use in your requests.

### **Step 2: Manage permissions**

Managing permissions controls what your custom storefront can display from your Shopify store.

1. From the Permissions section, click Edit.
2. Select the permissions for the storefront.
3. Click Save.

<figure><img src="/files/eSIyF4PnwL6ZVtdsXuVW" alt=""><figcaption></figcaption></figure>

### **Step 3: Enable the new customer account experience**

You can specify the following client application settings:

* **Callback URL(s)**: The allowable list of URLs to redirect to after logging in.
* **Javascript origin(s)**: Specifies the origins that are allowed to use a client's OAuth credentials in a JavaScript application. Applies to public client types.
* **Logout URL (Optional)**: The URL to redirect to after logging out.

### **Step 4: Set up the environment**

Configure the necessary Customer Account API settings in the Shopify admin so you can send the initial authentication request to Shopify.

1. In the Shopify admin, open the **Hydrogen** or **Headless** sales channel.
2. Click the storefront you're adding the customer account API functionality for.
3. Click Storefront settings.
4. Click Customer Account API to open the API settings.

From here, you can get **PUBLIC\_CUSTOMER\_ACCOUNT\_API\_CLIENT\_ID** and **PUBLIC\_CUSTOMER\_ACCOUNT\_API\_URL** then add to your environment.

### **Step 5: Update the application setup**

For the Customer Account API to recognize your domain as a valid authentication host, edit your Customer Account API settings.

<figure><img src="/files/NtDE2Y7QXCJ5PEFrkNIQ" alt=""><figcaption></figcaption></figure>

Under **Application setup**, click **Edit** to edit the endpoints.

Under **Callback URI(s)**, click **Add Callback URI**, and add your domain, with /account/authorize appended:

`https://<your-domain>.app/account/authorize`

This is the URI your application will redirect to to continue the OAuth process after a successful customer login.

Under **JavaScript origin(s)**, click **Add origin**, and then add your ngrok domain.

Under **Logout URI**, click **Add Logout URI**, and then add your ngrok domain.

Check out the video guide below:

{% embed url="<https://www.youtube.com/watch?v=C1k0aWv_Ckk>" %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://truestorefront.gitbook.io/owen-hydrogen-shopify-theme/setup-customer-account-api.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.