Validation of proxy calls fails - missing hmac query param

[tamir-boaideas]

Issue summary

To make ajax calls between the store frontend and my backend, I am using a proxy app on a dev store.
As the calls are coming from the frontend, the validateAuthenticatedSession middleware can't be used.

In the docs, I read about the HMAC query parameter and how I should validate the call by validating the HMAC, so I tried to use the validateHmac method but it didn't work.
Upon looking at the query params from the request, I discovered there was no hmac query parameter (although validateHmac expects hmac).

From the proxy request, I receive the following req.query object:

{
shop: 'domain.myshopify.com',
  logged_in_customer_id: '',
  path_prefix: '/apps/my-app-proxy',
  timestamp: '1678975741',
  signature: 'some_signature_key'
}

I ran this line
const isValid = await shopify.api.utils.validateHmac(req.query);
and it throws an InvalidHmacError: Query does not contain an HMAC value.

I tried to replace the key name from signature to hmac

const params = {};
        for(const [key, value] of Object.entries(req.query)) {
            if(key !== 'signature') {
                params[key] = value;
            } else {
                params.hmac = value;
            }
        }
        const isValid = await shopify.api.utils.validateHmac(params);
        console.log('isValid: ', isValid); // isValue: false

But now isValid is false (it should be true because this is a real request).

Is this a bug or am I doing something wrong?

• @shopify/shopify-api version: 6.2.0
• Node version: 18.13.0
• Operating system: MacOS

Expected behavior

The shopify.api.utils.validateHmac should work properly without any outside manipulation of the query object

Actual behavior

The method expects a non-existing query param (hmac) and fails to validate the signature param

[mkevinosullivan]

As mentioned in the guide for validateHmac, "Shopify requests include an hmac query argument", that is, requests coming from Shopify will include a hmac query parameter. Therefore, validateHmac is for validating requests from Shopify only.

Is there any reason why you can't use authenticatedFetch in your frontend (which will add a session token to your request) that would then allow the backend to use validateAuthenticatedSession middleware?

[tamir-boaideas]

The API call is made from the store front via the app proxy url (defined in "App setup" in the partners dashboard), not from the embedded app.

I have a form on one of my content pages that should be able to send data to the app. It's done using a proxy app for authentication (so I'll know it came from my store) and for retrieving the logged-in customer id.

Doesn't a call to the proxy endpoint count as a Shopify request (since Shopify redirects it to the app)?

[mkevinosullivan]

Thanks for the extra information @tamir-boaideas ... according to the handling proxy requests page, it would appear that the hmac is added to the forwarded request, but with the query parameter name signature, not hmac.

This does appear to be a bug ... thanks for bringing it to our attention.