---
title: Customer Account API
description: >-
The Customer Account API lets you query the GraphQL Customer Account API
directly from your extension using the global fetch() function. Use this API
to access detailed customer data, including profile information, order
history, and saved addresses.
api_version: 2026-04
api_name: customer-account-ui-extensions
source_url:
html: >-
https://shopify.dev/docs/api/customer-account-ui-extensions/latest/target-apis/account-apis/customer-account-api
md: >-
https://shopify.dev/docs/api/customer-account-ui-extensions/latest/target-apis/account-apis/customer-account-api.md
---
# Customer Account API
The Customer Account API lets you query the [GraphQL Customer Account API](https://shopify.dev/docs/api/customer) directly from your extension using the global `fetch()` function. Use this API to access detailed customer data, including profile information, order history, and saved addresses.
Unlike other target APIs that expose typed properties on the [`shopify` global object](https://shopify.dev/docs/api/customer-account-ui-extensions/latest#target-apis-define-what-your-extension-does), this API provides direct access to the full GraphQL schema through `fetch('shopify://customer-account/api/2026-04/graphql.json')`. Authentication is handled automatically, so you don't need a session token.
The data available depends on the buyer's authentication state and your app's access scopes.
### Use cases
* **Fetch order history**: Query the customer's past orders to display a purchase history or recommend related products.
* **Access customer profile**: Retrieve the customer's name, email, and saved addresses for a personalized experience.
* **Write customer data**: Update customer records, create [metafields](https://shopify.dev/docs/apps/build/customer-accounts/metafields-in-customer-accounts), or modify order information directly through GraphQL mutations.
### Support Targets (24)
### Supported targets
* [customer-account.footer.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/footer#footer-render-after-)
* [customer-account.order-index.announcement.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-actions#order-index-announcement-)
* [customer-account.order-index.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-actions#order-index-block-)
* [customer-account.order-status.announcement.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-status#order-status-announcement-)
* [customer-account.order-status.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-status#order-status-block-)
* [customer-account.order-status.cart-line-item.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-status#cart-line-item-render-after-)
* [customer-account.order-status.cart-line-list.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-status#cart-line-list-render-after-)
* [customer-account.order-status.customer-information.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-status#customer-information-render-after-)
* [customer-account.order-status.fulfillment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/fulfillment-status#fulfillment-status-targets)
* [customer-account.order-status.payment-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/payments-and-returns#payments-and-returns-targets)
* [customer-account.order-status.return-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/payments-and-returns#return-details-render-after-)
* [customer-account.order-status.unfulfilled-items.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/fulfillment-status#unfulfilled-items-render-after-)
* [customer-account.order.action.menu-item.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-actions#order-action-menu-item-)
* [customer-account.order.action.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/order-actions#order-action-)
* [customer-account.order.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/full-page#order-specific-full-page-)
* [customer-account.page.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/full-page#customer-account-full-page-)
* [customer-account.profile.addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-default#profile-page-default-targets-)
* [customer-account.profile.announcement.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-default#profile-announcement-)
* [customer-account.profile.block.render](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-default#profile-block-)
* [customer-account.profile.company-details.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-b2b#profile-page-b2b-targets-)
* [customer-account.profile.company-location-addresses.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-b2b#company-location-addresses-render-after-)
* [customer-account.profile.company-location-payment.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-b2b#company-location-payment-render-after-)
* [customer-account.profile.company-location-staff.render-after](https://shopify.dev/docs/api/customer-account-ui-extensions/2026-04/targets/profile-page-b2b#company-location-staff-render-after-)
* customer-account.profile.payment.render-after
Examples
### Examples
* ####
##### Description
Query the buyer's name from the GraphQL Customer Account API. This example uses \`fetch()\` with a GraphQL query for \`customer { firstName lastName }\` and displays the result with \`useState\` and \`useEffect\`.
##### jsx
```jsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
import {useState, useEffect} from 'preact/hooks';
export default async () => {
render(, document.body);
};
const API_VERSION = '2025-10';
function Extension() {
const [name, setName] = useState(null);
useEffect(() => {
fetch(
`shopify://customer-account/api/${API_VERSION}/graphql.json`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
query: `query {
customer {
firstName
lastName
}
}`,
}),
},
)
.then((response) => response.json())
.then(({data: {customer}}) => {
setName(customer);
})
.catch(console.error);
}, []);
if (!name) {
return Loading…;
}
return (
Hello, {name.firstName} {name.lastName}!
);
}
```
* ####
##### Description
Fetch the buyer's past orders to display a purchase history. This example sends a GraphQL query for the last five orders and renders each order's name and total price.
##### jsx
```jsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
import {useState, useEffect} from 'preact/hooks';
export default async () => {
render(, document.body);
};
const API_VERSION = '2025-10';
function Extension() {
const [orders, setOrders] = useState(null);
useEffect(() => {
fetch(
`shopify://customer-account/api/${API_VERSION}/graphql.json`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
query: `query {
customer {
orders(first: 5) {
edges {
node {
name
totalPrice {
amount
}
}
}
}
}
}`,
}),
},
)
.then((response) => response.json())
.then(({data: {customer}}) => {
if (!customer) return;
setOrders(
customer.orders.edges.map(
(edge) => edge.node,
),
);
})
.catch(console.error);
}, []);
if (!orders) {
return Loading orders…;
}
return (
Recent Orders
{orders.map((order) => (
{order.name}
${order.totalPrice.amount}
))}
);
}
```
* ####
##### Description
Retrieve the buyer's saved addresses from their customer account. This example queries \`customer { addresses }\` via the GraphQL API and displays each address.
##### jsx
```jsx
import '@shopify/ui-extensions/preact';
import {render} from 'preact';
import {useState, useEffect} from 'preact/hooks';
export default async () => {
render(, document.body);
};
const API_VERSION = '2025-10';
function Extension() {
const [addresses, setAddresses] =
useState(null);
useEffect(() => {
fetch(
`shopify://customer-account/api/${API_VERSION}/graphql.json`,
{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
query: `query {
customer {
addresses(first: 5) {
edges {
node {
address1
city
zoneCode
}
}
}
}
}`,
}),
},
)
.then((response) => response.json())
.then(({data: {customer}}) => {
if (!customer) return;
setAddresses(
customer.addresses.edges.map(
(edge) => edge.node,
),
);
})
.catch(console.error);
}, []);
if (!addresses) {
return Loading addresses…;
}
if (addresses.length === 0) {
return (
No saved addresses found.
);
}
return (
Saved Addresses
{addresses.map((address, index) => (
{address.address1}
{address.city},{' '}
{address.zoneCode}
))}
);
}
```
***
## Best practices
* **Specify an API version**: Always include a specific API version in the request URL rather than using `unstable`, to ensure consistent behavior across deployments.
* **Handle errors gracefully**: The `fetch()` call can fail due to network issues or authentication problems. Always check the response status and handle errors appropriately.
***