HMAC SHA256 Produces Different Result if String vs Variable in Liquid, Shopify

Question

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)
    .update(twitchId)
    .digest('hex');

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

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

You need to show how you are assigning the ID to the variable. Without seeing that, there is no way to validate your question. — David Lazar, Dec 09 '18 at 22:43

score 1 · Answer 1 · answered Dec 09 '18 at 22:45

1

You need to show how you are assigning the ID to the variable. Without seeing that, there is no way to validate your question.

I did a quick test, and proved I get the same HMAC with a string and a variable, so it must be that you are doing something weird in your assignment:

<h1>{{ "12345678"  | hmac_sha256: "secret_key" }}</h1>
{% capture fizz %}12345678{% endcapture%}
<h1>{{ fizz   | hmac_sha256: "secret_key"}}</h1>

Produces:

fcfebc0d424982ce8c7a986264beb0d4b1de44507501451e142236404e5b9778 fcfebc0d424982ce8c7a986264beb0d4b1de44507501451e142236404e5b9778

answered Dec 09 '18 at 22:45

David Lazar

10,865
3
25
38

You are on the right track. I just added my own answer after discovering that my variable is not getting instantiated until after I'm trying to use it the sha256 filter. Side question related to my answer, do you know if the theme.liquid file is loaded before my response liquid file? If so, how come only javascript global variables are accessible to my response liquid file and not liquid variables? – Nick H Dec 09 '18 at 23:27

score 0 · Accepted Answer · answered Dec 09 '18 at 23:20

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.

HMAC SHA256 Produces Different Result if String vs Variable in Liquid, Shopify

2 Answers2