HMAC SHA256 Produces Different Result If String Vs Variable In Liquid, Shopify

- 1 answer

I'm doing some URL verification between a Shopify site and my app. On Shopify, in a .liquid file, I'm creating an HMAC value using Shopify's built in hmac_sha256 string filter. I'm using a secret key and a Twitch user ID which I've stored in a customer tag.

The hash value is passed as a query parameter to my app, which uses the crypto module in node.js to generate a hash and compare it with the hash from the url.

Things get strange here: In the .liquid file, when I type the Twitch ID directly into the string filter, the hash value generated by the .liquid file is the same value my app generates, and everything looks good:

{{ "12345678" | hmac_sha256: "secret_key" }}

However, when I pass the same Twitch ID as a variable into the string filter, the hash value the liquid file generates is different than the first time:

{{ twitchId | hmac_sha256: "secret_key" }}

I've already tried removing whitespace and newline characters from the Twitch ID variable just in case there were any. I don't even have a guess as to what the problem could be. Maybe the variable (which is a string) is encoded differently than when I type it in directly?

For reference, the javascript code checking for matching hashes:

    // Get query string params:
    const { hash, twitchId } = req.query;
    console.log('Twitch ID in query: ' + twitchId);

    // Verify user
    const generatedUserHash = crypto
    .createHmac('sha256', userVerifySecret)

    console.log('Passed hash: ' + hash + ' Generated hash: ' + generatedUserHash);

    if (generatedUserHash == hash) {
        return true;
    } else {
        return false;


Turns out my variable twitchId was getting instantiated after I was trying to use it in the sha256 filter. I was instantiating it in my theme.liquid file, and I was trying to access it in a liquid file in my app (the request from the Shopify site is responded to with a liquid file).

I guess I wrongly assumed the theme.liquid file is loaded before the file in my response to Shopify. I assumed this because javascript variables I instantiate in my theme.liquid file are available in my response liquid file (I think this has something to do with liquid variables being created server-side and javascript variables being created client-side).

I am now instantiating the twitchId variable in my response liquid file. So that solved it.