Storefront api return a [API] Invalid API key or access token (unrecognized login or wrong password)

[Mickael_Houet]

Hello,

For the need of a custom app, created on my partner page and well installed on a shop, I'm trying to use the storefront api by following the documentation :
https://shopify.dev/docs/api/storefront#authentication

I have of course activated "storefront api" on my shopify partner for my app.

First, I have created a storefront access token with the POST REST request (https://shopify.dev/docs/api/admin-rest/2024-01/resources/storefrontaccesstoken) :

{
    "storefront_access_token":{
        "title":"Test"
    }
}

The response seems to be ok :

{
    "storefront_access_token": {
        "access_token": "bdc(...)6e3",
        "access_scope": "unauthenticated_read_content,unauthenticated_read_metaobjects,unauthenticated_read_customer_tags,unauthenticated_read_product_tags,unauthenticated_read_product_inventory,unauthenticated_read_product_listings,unauthenticated_write_checkouts,unauthenticated_read_checkouts,unauthenticated_write_customers,unauthenticated_read_customers,unauthenticated_read_selling_plans,unauthenticated_read_product_pickup_locations",
        "created_at": "2024-01-19T09:37:53-05:00",
        "id": 87145120026,
        "admin_graphql_api_id": "gid://shopify/StorefrontAccessToken/87145120026",
        "title": "Test"
    }
}

And when I "get" the storefront_access_token via a REST request :
https://{{url}}/admin/api/2024-01/storefront_access_tokens.json
I can see my token newly created.

So, apparently, everything seem's to be ok .... for now.

I'm trying to use this storefront_access_token to simply retrieve product on my shop with a graphQl request, directly on postman (I provide of course the full token, the "..." on the screen bellow is just here to not show you my token):

But, I always have a 401 in return.

{
    "errors": "[API] Invalid API key or access token (unrecognized login or wrong password)"
}

It's very frustrating.
For information, I'm also using admin api without any problem (with the X-Shopify-Access-Token retrieved during the oauth process installation of my app).

What am I doing wrong ?

Thank's for your help :).

[Mickael_Houet · Accepted solution]

ok, I found the solution :

On the url is

https://{{url}}/api/2024-01/graphql.json

and not

https://{{url}}/admin/api/2024-01/graphql.json

[badrooxe]

hey man i'm trying to generate a storefront access token using this graphql mutation

try {
      // Your logic goes here
      const gqlPayload = {
        input: {
          title: "xtry storefront access token",
          //accessScope: "unauthenticated_read_checkouts"
        }
      };

      const response = await connections.shopify.current?.graphql(
        STOREFRONT_ACCESS_TOKEN_CREATE_MUTATION,
        gqlPayload
      );

      if (!response) {
        logger.error({response}, `Failed to create storefront access token.`);
        return { exists: false, data: null };
      } else {
        logger.debug({ response }, `Fetched storefront access token response from Shopify API.`);
        logger.debug({ gqlPayload }, `gqlPayload.`);
      }
      return {
        exists: true,
        data: {
            response
        }
    };
    } catch (error) {
      logger.error({ error }, `An error occurred while creating storefront access token.`);
      return { exists: false, data: null };
    }​

export const STOREFRONT_ACCESS_TOKEN_CREATE_MUTATION = `
mutation storefrontAccessTokenCreate($input: StorefrontAccessTokenInput!) {
  storefrontAccessTokenCreate(input: $input) {
    shop {
      id
      name
    }
    storefrontAccessToken {
      id
      accessToken
    }
    userErrors {
      field
      message
    }
  }
}`

idk if i'm wrong in the payload or it's something else
also can you please provide the link where you created the storefront access token since i couldn't find it in postman

[Mickael_Houet]

Hi,

You can create a storefront access token by this two ways :

API REST :

url in POST : https://{{your_shop_name}}.myshopify.com/admin/api/2024-01/storefront_access_tokens.json

with payload :

{
"storefront_access_token":{
"title":"Test"
 }
}

API GRAPHQL :

url in POST : https://{{your_shop_name}}.myshopify.com/admin/api/2024-01/graphql.json

with graphql query :

mutation storefrontAccessTokenCreate($input: StorefrontAccessTokenInput!) {
  storefrontAccessTokenCreate(input: $input) {
    shop {
        name
    }
    storefrontAccessToken {
          accessToken
    }
    userErrors {
      field
      message
    }
  }
}

and with graphql variables :

{
  "input": {
    "title": "test"
  }
}

For both requests, of course you must provide your X-Shopify-Access-Token in the header.

After that, you can retrieve all your storefront access token with this REST request :

url in GET : https://{{your_shop_name}}.myshopify.com/admin/api/2024-01/storefront_access_tokens.json

with X-Shopify-Access-Token in the header.