Introducing cookieless authentication beta with App Bridge

[Liam]

With the strong focus on privacy, browsers have recently started phasing out support for the 3rd party cookie. This has caused issues for embedded apps which until now have required the use of 3rd party cookies.

Our new App Bridge auth beta introduces “session tokens” to empower developers to create faster, more flexible, and more compatible apps. Session token based auth does not depend on cookies and instead relies on a Shopify-generated token that your app needs to send with every request.

In order to get started with App Bridge auth, or migrate your current app from traditional, cookie-based authentication, you can follow the guide in our developer documentation.

Questions about App Bridge auth or session tokens? Post them in this board or reach out to support through your partner dashboard.

[policenauts1]

@Michael_Ragalie thanks for the response, makes sense. In my case, both of my apps are POS embedded apps and so the "session" is always quite short and moment in time for the merchant. Please keep us updated when JWT becomes available for POS embedded apps. 

[Michael_Ragalie]

I don't know if we have any apps using it on POS, but I think it _should_ work. Was there a problem you were running into with it?

[policenauts1]

@Michael_Ragalie I actually haven't tried it yet, I thought I saw on page 1 or 2 of this thread that someone else asked about it for POS and was told it wasn't ready. But based on reading the documentation, I also don't see a reason it shouldn't work. Thanks for following up. 

[aedr]

I'm finding the documentation lacking, i've tried trawling through the app-bridge code but that wasn't much help either.

Ideally it would be great if i could embed my app admin functionality but its not a shopify specific application so i don't really want to pollute it with shopify specific libs and code. I appreciate I might have to but I would like to have as little impact as possible. From the Documentation it is my understanding that the minimal shopify code I need is `Provider` (is that true can i get the jwt token without app-bridge?) but how do I actually get the JWT? The docs say i can get it manually but with no examples, am i supposed to use react component? Is it in the session storage? is it on a header? 

I'm already using JWT for non shopify based users so it would be great if I could get it working.

[Michael_Ragalie]

I think you'll need to use App Bridge to get a token. The "manual" approach
is still using App Bridge, just lower level aspects of it.

[optizio]

Are apps that don't use this method getting rejected? We've had an application rejected because (we believe) the tester was using incognito mode.

[tolgapaksoy]

If you're redirecting users to a subscription URL from your app, the redirect will cause an IFRAME issue in the browser.

You need to perform the redirection from outside your app IFRAME. Either using the AppBridge redirection, or using window.top.location.href.

[optizio]

This isn't the issue. I've been sent a screencast by the tester show he/she had been testing in Incognito mode. They failed the submission (again), naming 'SameSite' as the issue (I guarantee this is done correctly).

You can validate by visiting https://samesite-sandbox.glitch.me/ in a normal chrome window, and an incognito window.

As far as I'm concerned, if testers are expecting your application to work in incognito mode, then you MUST implement cookie-less authentication. Is this mentioned anywhere int he documentation?

[policenauts1]

@optizio are you using the shopify_app gem? I had built an app using the shopify_app gem and it also failed naming the samesite issue with an infinite redirect issue (though I simply could not reproduce). I ended up migrating away from shopify_app gem and using my own auth and got it to pass. 

[policenauts1]

@Michael_Ragalie I've finally gotten around to playing around with this and I have a question. I found the npm library which seems to work well (thank you Leigh Barnes).

However, there's part of my app's server that will be hosted on Google Apps Script and I have to manually decode and verify the JWT there. When I do:

var byteSignature = Utilities.computeHmacSha256Signature(<header>.<payload>, 'sshhh');
var signed = Utilities.base64EncodeWebSafe(byteSignature);

signed equals the <signature> from the JWT, except signed has an extra = padding character(s) at the end. It seems all the Apps Script methods for Base64Encode will pad it. Is it safe to just drop any padding = characters for the purposes of the boolean comparison? Or is there a different / better way?  

[optizio]

@policenauts1 - we were using the node shopify app cli, with no changes, and the app got rejected (for the same infinite loop issue when there no cookies allowed).

[policenauts1]

@optizio gotcha - from reading the JWT documentation, it's not clear to me whether they've incorporated JWT into that library or have provided steps to override the built-in auth with JWT. Perhaps someeone from Shopify can weigh in here.

[HunkyBill]

So you tested your App thoroughly, never experienced this infinite loop issue, but the Shopify Review experienced infinite loop, so clearly, the App Review process is broken? Usually, Shopify would admit to this, as they can tell when their tests are flakey, as per their admission that the whole Same Site cookie test issued false positives for the problem.

[optizio]

@HunkyBill - Yes that's right, tested extremely thoroughly and agree with your sentiment. I can replicate the issue on my own app, as well as many big production apps, when I block ALL third party cookies (either manually or by browsing in incognito mode). If they are testing in Incognito mode, I'm of the opinion that all apps that use cookies will fail review with this infinite loop issue (it happens with the default app built with the Shopify cli (node)).

[optizio]

Just to add to the topic at hand. If you are implementing cookie-less auth and use { authenticatedFetch } - make sure you use the exact version mentioned in the docs here (https://shopify.dev/tutorials/authenticate-your-app-using-session-tokens) (1.23.0) - newer versions fail when proxying graphql requests. Having already spent hours figuring out that a patch version bump was the cause of my pain, I haven't had the time to figure out exactly what's different in those two versions!

To be fair, it does state you 'NEED' that version, silly me 😉

[HunkyBill]

This thread is supposed to be nothing but an intro to JWT being useful for Apps. We should collectively try and establish other threads for other problems. If oAuth to establish credentials is somehow borked with a Node App, it belongs in a Node oAuth thread. Otherwise we are all losing focus on the aspect of what is actually a problem, and for who.

[assafl]

Hi everyone,

This thread is great knowledge base for the session tokens subject

Thank you @KisukaKiza and @MathewsJoseph for your great contributions

However, I didn't get to see any response from Shopify team about official way to do this, must I remove koa packages and implement authentication logic on my own in order to use the new functionality?

Isn't there an official support planned to provide managed components integrated with it?

Would be great to get an official response here

[JoshHighland]

Can I get clarity on "dest" in the decoded JWT payload?

will "dest" ALWAYS be the *.myshopify.com account name, or can it be the TLD?

Example:

Domain = myshop.com
Shopify Account = myshop.myshopify.com

In the JWT payload will:

dest = myshop.com
or
dest = myshop.myshopify.com

[Adriano_Corte_R]

The dest field is always `https://{SHOP}.myshopify.com`

[TwoColors]

Why can't we just simply get this cookieless authentication integrated into Shopify App CLI? That way we can just set up some test project and see how it works, this would cut off half of the questions here. I have app with NodeJS (Koa) and React generated with Shopify App CLI, I would love to simply generate new project and compare it.