Choose a version:

Storefront API

Contains objects used to interact with the Storefront API.

This object is returned as part of different contexts, such as appProxy, and unauthenticated.storefront.

Anchor to storefrontstorefront

Provides utilities that apps can use to make requests to the Storefront API.

Anchor to graphql graphql required: Method for interacting with the Shopify Storefront GraphQL API

If you're getting incorrect type hints in the Shopify template, follow these instructions.

GraphQLClient

query
```
string
```
options
```
GraphQLQueryOptions
```

returns

Promise<Response>

GraphQLQueryOptions

apiVersion
```
ApiVersion
```
headers
```
{ [key: string]: any; }
```
tries
```
number
```
variables
```
QueryVariables
```

QueryVariables

[key: string]
```
any
```

Examples

Example

import { ActionArgs } from "@remix-run/node";

import { authenticate } from "../shopify.server";

export async function action({ request }: ActionArgs) {

const { storefront } = await authenticate.storefront(request);

const response = await storefront.graphql(`{blogs(first: 10) { edges { node { id } } } }`);

const productData = await response.json();

return json({ data: productData.data });

}

Examples

Description

Use `storefront.graphql` to make query / mutation requests.

Example

import { ActionArgs } from "@remix-run/node";
import { authenticate } from "../shopify.server";

export async function action({ request }: ActionArgs) {
  const { storefront } = await authenticate.storefront(request);

  const response = await storefront.graphql(`{blogs(first: 10) { edges { node { id } } } }`);

  const productData = await response.json();
  return json({ data: productData.data });
}

Anchor to RelatedRelated

Authenticate requests from Shopify app proxies.App proxy context

Interact with the Storefront API on non-Shopify requests.Unauthenticated context

Was this page helpful?