shopify-session-tokens-nextjs

shopify-session-tokens-nextjs copied to clipboard

I'm having a very similar issue to https://github.com/ctrlaltdylan/shopify-nextjs-toolbox/issues/13, using the latest version of this repo. I have written a simple saveNonce function and am exporting it with export default handleAuthStart({ saveNonce }); at the bottom of api/auth.js

I then try to install it into the shopify dev store and it redirects to a strange url (as described in the issue above): https://<store>.myshopify.com/admin/apps/<appid>/?hmac=<hmac>&host=<hostid>&shop=<store>.myshopify.com&timestamp=1652701151 (senitive parts omitted in <>)

Whereby shopify give an error on the page

There’s no page at this address Check the URL and try again, or use the search bar to find what you need.

Checking the vercel function logs, I can see clearly the POST requests to /api/auth were successful, and logging shows the nonce was added to the database correctly.

What is strange is that removing the saveNonce, the app functions perfectly. So the question is - why is saveNonce causing it to do this?

Any ideas why? I've looked at the code for handleAuthStart and am stumped as to why it is doing this.

Side note - great starter app. First one so far that has actually worked and not super out of date ❤️

I've also just tested the following: saveNonce with just a single console.log - working saveNonce with 5s sleep: await new Promise(r => setTimeout(r, 5000)); - not working

It seems as though somewhere it waits about 1-2 seconds before redirecting. If the saveNonce promise hasn't resolved by then, it redirects to the wrong url.

I've dug into this a bit more - as it turns out the Shopify app bridge provider is the culprit.

It will redirect after an unspecified time (usually 1-3s) whereby if the app hasn't beaten it to it the app bridge will try to redirect as if the app is installed, resulting in an error page (as it isn't installed). If the script beats the app bridge, it successfully redirects to the oAuth url as per normal.

You can confirm this by setting forceRedirect = false which will tell the app bridge to not redirect. This means it installs successfully, but isn't embedded as the app bridge wont redirect to the embed url.

Im testing a couple of different ways to fix this and will hopefully have a pr soon

Thanks @matthewhilton , I've not been able to reproduce this bug myself and I use it in production across a couple of apps.

A PR would be most welcome.