The tutorial Shopify app can't set cookies, escapes admin iframe

Highlighted
Shopify Partner
9 0 1

A year ago, I successfully completed the tutorial app from Build a Shopify app with Node.js and React

Long story short, after forgetting all about it, I tried to complete it once again.

 

Only this time, at the end of step 3, when I go to my test store, view my app list ([store].myshopify.com/admin/apps) and click on the app, I briefly see a popup saying " Enable cookies - You must manually enable cookies in this browser in order to use this app within Shopify." (exactly like the one shown in this thread), and then I get redirected to the URL of my app (instead of seeing it in an Iframe). More specifically, it very quickly loads a bunch of URLs like those:

[mytesturl].ngrok.io/auth/enable_cookies?shop=[store].myshopify.com
[mytesturl].ngrok.io/auth?shop=[store].myshopify.com

and I eventually end up on:
[mytesturl].ngrok.io

 

(as far as I remember and can see from the tutorial screenshots, the expect result would be to still be in my shop, on a subpage for the app, with my the [mytesturl].ngrok.io stuff in an iframe on this page)

 

Also found that issue mentioned in this thread https://community.shopify.com/c/Shopify-Apps/Some-Third-Party-Apps-may-not-be-accessible-on-Chrome-80-update/m-p/650220 and from the last answer there (on May 7th) it looks like I'm not the only one having trouble with the code form the tutorial...

 

From what I read, it looks like the tutorial app does contain the "fix" (the one described here https://shopify.dev/tutorials/migrate-your-app-to-support-samesite-cookies , with SameSite=None), only it doesn't actually work, apparently :s I tested on Firefox and Brave.

Any idea how to fix this? Any plan to fix the tutorial app? 

0 Likes
Shopify Partner
9 0 1

A little update: I found a dirty workaround for this issue: I downgraded koa and koa-session to the versions I used the last time I followed the tutorial (respectively version 2.7.0 and 5.11.0), and I replaced

server.use(session({ secure: true, sameSite: 'none' }, server));

with the old:

server.use(session(server));

in server.js

 

Obviously this isn't a future-proof option though...

0 Likes