Error 500 in app proxy

Hi guys,

In theme app extension I’m trying to implement fetching data from the API. I added a javascript file which send a request to app proxy.

It works well when I use the following code example:

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

export async function loader({ request }) {
  const { liquid } = await authenticate.public.appProxy(request);
   return liquid("Hello {{shop.name}}", { layout: false });
}

However as soon as I add a GraphQL request, it returns the error 500:

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

export async function loader({ request }) {
  const { liquid } = await authenticate.public.appProxy(request);
  const { storefront } = await authenticate.public.appProxy(request);
  const response = await storefront.graphql(
    `query GetProductsCount {
        productsCount {
          count
        }
      }`,
  );

  return liquid("Hello {{shop.name}}", { layout: false });
}

App scopes are set like this:

scopes = "read_customer_events,read_products,write_pixels,write_products"

Any advice of what can cause the error? Thank you in advance.

Hi Ivan,

It looks like you’re calling authenticate.public.appProxy(request) twice - if you retrieve both liquid and storefront in a single call, does this change what you’re seeing returned?

Hi @Liam-Shopify,

Thank you for your reply.

I just set the code like this:

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

export async function loader({ request }) {
  const { liquid, storefront } = await authenticate.public.appProxy(request);
  const response = await storefront.graphql(
    `query GetProductsCount {
        productsCount {
          count
        }
      }`,
  );

  return liquid("Hello {{shop.name}}", { layout: false });
}

But unfortunately, it still returns error 500. It works only of I remove graphql querry.

Is there any way to get additional information about the reason of the problem? Maybe kind of log file? I’m using Remix.

Thanks.

I was able to make it working by replacing strorefront with the admin.

Here is the code that works for me:

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

export async function loader({ request }) {
  const { admin, liquid } = await authenticate.public.appProxy(request);
  try {
    const response = await admin.graphql(
      `query GetProductsCount {
            productsCount {
              count
            }
          }`,
    );

    const body = await response.json();
    const count = body.data.productsCount.count;
    return liquid(`Count: ${count}`, { layout: false });
  } catch (error) {
    return error;
  }
}
1 Like

Hi Ivan,

Thanks for coming back with this solution - it does indeed look like you should have been using the Admin API instead of the Storefront API.

1 Like