---
title: App proxy
description: >-
  The `authenticate.public.appProxy` function validates app proxy requests made
  by Shopify, and returns a context to enable querying Shopify APIs.
api_version: v1
api_name: shopify-app-remix
source_url:
  html: >-
    https://shopify.dev/docs/api/shopify-app-remix/v1/authenticate/public/app-proxy
  md: >-
    https://shopify.dev/docs/api/shopify-app-remix/v1/authenticate/public/app-proxy.md
---

# App proxy

The `authenticate.public.appProxy` function validates app proxy requests made by Shopify, and returns a context to enable querying Shopify APIs.

## authenticate.​public.​app​Proxy([request](#authenticatepublicappproxy-propertydetail-request)​)

Authenticates requests coming from Shopify app proxies.

### Parameters

* request

  Request

  required

### Returns

* Promise\<AppProxyContext | AppProxyContextWithSession>

### AppProxyContext

* session

  No session is available for the shop that made this request. This comes from the session storage which \`shopifyApp\` uses to store sessions in your database of choice.

  ```ts
  undefined
  ```

* admin

  No session is available for the shop that made this request. Therefore no methods for interacting with the GraphQL / REST Admin APIs are available.

  ```ts
  undefined
  ```

* storefront

  No session is available for the shop that made this request. Therefore no method for interacting with the Storefront API is available.

  ```ts
  undefined
  ```

* liquid

  A utility for creating a Liquid Response.

  ```ts
  LiquidResponseFunction
  ```

```ts
export interface AppProxyContext extends Context {
  /**
   * No session is available for the shop that made this request.
   *
   * This comes from the session storage which `shopifyApp` uses to store sessions in your database of choice.
   */
  session: undefined;

  /**
   * No session is available for the shop that made this request.
   * Therefore no methods for interacting with the GraphQL / REST Admin APIs are available.
   */
  admin: undefined;

  /**
   * No session is available for the shop that made this request.
   * Therefore no method for interacting with the Storefront API is available.
   */
  storefront: undefined;
}
```

### LiquidResponseFunction

* body

  ```ts
  string
  ```

* initAndOptions

  ```ts
  number | (ResponseInit & Options)
  ```

Response

```ts
Response
```

```ts
export type LiquidResponseFunction = (
  body: string,
  initAndOptions?: number | (ResponseInit & Options),
) => Response;
```

### Options

* layout

  ```ts
  boolean
  ```

```ts
interface Options {
  layout?: boolean;
}
```

### AppProxyContextWithSession

* session

  The session for the shop that made the request. This comes from the session storage which \`shopifyApp\` uses to store sessions in your database of choice. Use this to get shop or user-specific data.

  ```ts
  Session
  ```

* admin

  Methods for interacting with the GraphQL / REST Admin APIs for the store that made the request.

  ```ts
  AdminApiContext<Resources>
  ```

* storefront

  Method for interacting with the Shopify Storefront Graphql API for the store that made the request.

  ```ts
  StorefrontContext
  ```

* liquid

  A utility for creating a Liquid Response.

  ```ts
  LiquidResponseFunction
  ```

````ts
export interface AppProxyContextWithSession<
  Resources extends ShopifyRestResources = ShopifyRestResources,
> extends Context {
  /**
   * The session for the shop that made the request.
   *
   * This comes from the session storage which `shopifyApp` uses to store sessions in your database of choice.
   *
   * Use this to get shop or user-specific data.
   *
   * @example
   * <caption>Using the session object.</caption>
   * <description>Get your app's data using an offline session for the shop that made the request.</description>
   * ```ts
   * // app/routes/**\/.ts
   * import { json } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   * import { getMyAppModelData } from "~/db/model.server";
   *
   * export const loader = async ({ request }) => {
   *   const { session } = await authenticate.public.appProxy(request);
   *   return json(await getMyAppModelData({shop: session.shop));
   * };
   * ```
   */
  session: Session;

  /**
   * Methods for interacting with the GraphQL / REST Admin APIs for the store that made the request.
   *
   * @example
   * <caption>Interacting with the Admin API.</caption>
   * <description>Use the `admin` object to interact with the REST or GraphQL APIs.</description>
   * ```ts
   * // app/routes/**\/.ts
   * import { json } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   *
   * export async function action({ request }: ActionArgs) {
   *   const { admin } = await authenticate.public.appProxy(request);
   *
   *   const response = await admin.graphql(
   *     `#graphql
   *     mutation populateProduct($input: ProductInput!) {
   *       productCreate(input: $input) {
   *         product {
   *           id
   *         }
   *       }
   *     }`,
   *     { variables: { input: { title: "Product Name" } } }
   *   );
   *
   *   const productData = await response.json();
   *   return json({ data: productData.data });
   * }
   * ```
   */
  admin: AdminApiContext<Resources>;

  /**
   * Method for interacting with the Shopify Storefront Graphql API for the store that made the request.
   *
   * @example
   * <caption>Interacting with the Storefront API.</caption>
   * <description>Use the `storefront` object to interact with the GraphQL API.</description>
   * ```ts
   * // app/routes/**\/.ts
   * import { json } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   *
   * export async function action({ request }: ActionArgs) {
   *   const { admin } = await authenticate.public.appProxy(request);
   *
   *   const response = await storefront.graphql(`{blogs(first: 10) { edges { node { id } } } }`);
   *
   *   return json(await response.json());
   * }
   * ```
   */
  storefront: StorefrontContext;
}
````

### AdminApiContext

* rest

  Methods for interacting with the Shopify Admin REST API There are methods for interacting with individual REST resources. You can also make \`GET\`, \`POST\`, \`PUT\` and \`DELETE\` requests should the REST resources not meet your needs.

  ```ts
  RestClientWithResources<Resources>
  ```

* graphql

  Methods for interacting with the Shopify Admin GraphQL API

  ```ts
  GraphQLClient
  ```

````ts
export interface AdminApiContext<
  Resources extends ShopifyRestResources = ShopifyRestResources,
> {
  /**
   * Methods for interacting with the Shopify Admin REST API
   *
   * There are methods for interacting with individual REST resources. You can also make `GET`, `POST`, `PUT` and `DELETE` requests should the REST resources not meet your needs.
   *
   * {@link https://shopify.dev/docs/api/admin-rest}
   *
   * @example
   * <caption>Using REST resources.</caption>
   * <description>Getting the number of orders in a store using REST resources.</description>
   *
   * ```ts
   * // /app/shopify.server.ts
   * import { shopifyApp } from "@shopify/shopify-app-remix/server";
   * import { restResources } from "@shopify/shopify-api/rest/admin/2023-07";
   *
   * const shopify = shopifyApp({
   *   restResources,
   *   // ...etc
   * });
   * export default shopify;
   * export const authenticate = shopify.authenticate;
   * ```
   *
   * ```ts
   * // /app/routes/**\/*.ts
   * import { LoaderArgs, json } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   *
   * export const loader = async ({ request }: LoaderArgs) => {
   *   const { admin, session } = await authenticate.admin(request);
   *   return json(admin.rest.resources.Order.count({ session }));
   * };
   * ```
   *
   * @example
   * <caption>Performing a GET request to the REST API.</caption>
   * <description>Use `admin.rest.<method>` to make custom requests to the API.</description>
   *
   * ```ts
   * // /app/shopify.server.ts
   * import { shopifyApp } from "@shopify/shopify-app-remix/server";
   * import { restResources } from "@shopify/shopify-api/rest/admin/2023-04";
   *
   * const shopify = shopifyApp({
   *   restResources,
   *   // ...etc
   * });
   * export default shopify;
   * export const authenticate = shopify.authenticate;
   * ```
   *
   * ```ts
   * // /app/routes/**\/*.ts
   * import { LoaderArgs, json } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   *
   * export const loader = async ({ request }: LoaderArgs) => {
   *   const { admin, session } = await authenticate.admin(request);
   *   const response = await admin.rest.get({ path: "/customers/count.json" });
   *   const customers = await response.json();
   *   return json({ customers });
   * };
   * ```
   */
  rest: RestClientWithResources<Resources>;

  /**
   * Methods for interacting with the Shopify Admin GraphQL API
   *
   * {@link https://shopify.dev/docs/api/admin-graphql}
   * {@link https://github.com/Shopify/shopify-api-js/blob/main/docs/reference/clients/Graphql.md}
   *
   * @example
   * <caption>Querying the GraphQL API.</caption>
   * <description>Use `admin.graphql` to make query / mutation requests.</description>
   * ```ts
   * import { ActionArgs } from "@remix-run/node";
   * import { authenticate } from "../shopify.server";
   *
   * export async function action({ request }: ActionArgs) {
   *   const { admin } = await authenticate.admin(request);
   *
   *   const response = await admin.graphql(
   *     `#graphql
   *     mutation populateProduct($input: ProductInput!) {
   *       productCreate(input: $input) {
   *         product {
   *           id
   *         }
   *       }
   *     }`,
   *     { variables: { input: { title: "Product Name" } } }
   *   );
   *
   *   const productData = await response.json();
   *   return json({ data: productData.data });
   * }
   * ```
   */
  graphql: GraphQLClient;
}
````

### RestClientWithResources

```ts
RemixRestClient & {resources: Resources}
```

### StorefrontContext

* graphql

  Method for interacting with the Shopify Storefront GraphQL API If you're getting incorrect type hints in the Shopify template, follow \[these instructions]\(https://github.com/Shopify/shopify-app-template-remix/tree/main#incorrect-graphql-hints).

  ```ts
  GraphQLClient
  ```

````ts
export interface StorefrontContext {
  /**
   * Method for interacting with the Shopify Storefront GraphQL API
   *
   * If you're getting incorrect type hints in the Shopify template, follow [these instructions](https://github.com/Shopify/shopify-app-template-remix/tree/main#incorrect-graphql-hints).
   *
   * {@link https://shopify.dev/docs/api/storefront}
   *
   * @example
   * <caption>Querying the GraphQL API.</caption>
   * <description>Use `storefront.graphql` to make query / mutation requests.</description>
   * ```ts
   * 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 });
   * }
   * ```
   */
  graphql: GraphQLClient;
}
````

## Examples

### session

### Examples

* #### Using the session object

  ##### Description

  Get your app's data using an offline session for the shop that made the request.

  ##### app/routes/\*\*\\/.ts

  ```typescript
  import { json } from "@remix-run/node";
  import { authenticate } from "../shopify.server";
  import { getMyAppModelData } from "~/db/model.server";

  export const loader = async ({ request }) => {
    const { session } = await authenticate.public.appProxy(request);
    return json(await getMyAppModelData({shop: session.shop));
  };
  ```

### admin

### Examples

* #### Interacting with the Admin API

  ##### Description

  Use the \`admin\` object to interact with the REST or GraphQL APIs.

  ##### app/routes/\*\*\\/.ts

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

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

    const response = await admin.graphql(
      `#graphql
      mutation populateProduct($input: ProductInput!) {
        productCreate(input: $input) {
          product {
            id
          }
        }
      }`,
      { variables: { input: { title: "Product Name" } } }
    );

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

### storefront

### Examples

* #### Interacting with the Storefront API

  ##### Description

  Use the \`storefront\` object to interact with the GraphQL API.

  ##### app/routes/\*\*\\/.ts

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

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

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

    return json(await response.json());
  }
  ```

### liquid

### Examples

* #### Rendering liquid content

  ##### Description

  Use the \`liquid\` helper to render a \`Response\` with Liquid content.

  ##### app/routes/\*\*\\/.ts

  ```typescript
  import {authenticate} from "~/shopify.server"

  export async function loader({ request }) {
    const {liquid} = authenticate.public.appProxy(request);

    return liquid("Hello {{shop.name}}")
  }
  ```

## Related

[Interact with the Admin API. - Admin API context](https://shopify.dev/docs/api/shopify-app-remix/apis/admin-api)

[Interact with the Storefront API. - Storefront API context](https://shopify.dev/docs/api/shopify-app-remix/apis/storefront-api)