---
tags:
  - publishable api key
  - api key
  - storefront
  - sales channel
---

export const metadata = {
  title: `Use a Publishable API Key in the Storefront`,
}

# {metadata.title}

When sending requests to the `/store` API routes, you must pass the publishable API key in the header of your request.

## What is a Publishable API Key?

Publishable API keys specify the scope of a request. Admin users create them, and they can only be used on the client-side, such as in a storefront.

Publishable API keys are associated with sales channels. Then, when the publishable API key is passed in the header of a request, the Medusa application automatically infers what sales channel is being used.

---

## How to Create a Publishable API Key?

You create a publishable API key either using the [Medusa Admin](!user-guide!/settings/developer/publishable-api-keys) or the [Admin API routes](!api!/admin#api-keys_postapikeys).

For example, using the [Create API Key API Route](!api!/admin#api-keys_postapikeys):

```bash
curl -X POST 'http://localhost:9000/admin/api-keys' \
-H 'Authorization: Bearer {token}' \
-H 'Content-Type: application/json' \
--data-raw '{
  "title": "Storefront Key",
  "type": "publishable"
}'
```

<Note title="Tip">

Learn how to send authenticated admin requests in the [Admin API reference](!api!/admin#authentication)

</Note>

To add sales channels to the publishable API key's scope, use the [Manage Sales Channels API route](!api!/admin#api-keys_postapikeysidsaleschannels):

```bash
curl -X POST 'http://localhost:9000/admin/api-keys/apk_123/sales-channels' \
-H 'Authorization: Bearer {token}' \
-H 'Content-Type: application/json' \
--data-raw '{
  "add": ["sc_123"]
}'
```

Make sure to replace `apk_123` with the ID of the publishable API key, and `sc_123` with the ID of the sales channel.

---

## How to Use Publishable API Key in Storefront Requests

In your storefront, pass the `x-publishable-api-key` in the header of all your requests to the Medusa application.

For example:

export const highlights = [
  ["4", "NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY", "An environment variable that holds the publishable API key's token."]
]

```ts
fetch(`http://localhost:9000/store/products`, {
  credentials: "include",
  headers: {
    "x-publishable-api-key": process.env.NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY || "temp",
  },
})
.then((res) => res.json())
.then((data) => {
  // use products...
  console.log(data.products)
})
```

Where `NEXT_PUBLIC_MEDUSA_PUBLISHABLE_KEY` is an environment variable that holds your publishable API key's token.
