getSessionToken (client-side) and Shopify.Utils.loadCurrentSession (server-side) don't work well together

[delyan-peev]

Hey there,

I'm running into an annoying behavior while using getSessionToken on the client-side React (embedded) app and verifying its validity with Shopify.Utils.loadCurrentSession on the server-side (this is essentially what this does under the hood as it fails if the JWT is invalid) with online tokens enabled. I'm using a project setup that I've pretty much borrowed from the Shopfy node template with React & Express.

It just so happens that I'm running the React app on one machine (my host Windows machine) and the Express server on a WSL Ubuntu VM. These two machines are sometimes out of sync in terms of time by a few seconds. So every now and then the FE machine is a few seconds behind. Then, when making a request, executing getSessionToken in React, it fetches the existing token that it considers valid (I believe there is client-side checking for whether a token needs to be renewed). The request goes to the server and when the server calls Shopify.Utils.loadCurrentSession, I get an Error that the JWT is invalid (I believe this is also based on machine time, since the server-side machine is ahead by 10-ish seconds).

This is a rather annoying situation, since I cannot seem to find a way to request a new session token on the client-side through the exposed AppBridge features and I do not feel it's right forging a GenerateSessionToken GraphQL mutation myself as it seems like a shaky implementation provided something on the Shopify side changes without me adjusting the client app.

This is a tricky situation to run in production, since I cannot be sure what my customers' machine times will be and I could not find a workaround myself.

Please, let me know if I am doing anything wrong.

Thanks for your help.

To Reproduce

Steps to reproduce the behaviour:

1. Using the shopify app node template, run the FE on one machine and the BE on another.
2. Manually force the machines out of time sync with the BE being ahead enough time to give you a "faulty" request.
3. Fire a request with a JWT that is OK from the client-side point of view and expired on the server-side point-of-view.

Expected behaviour

I'm happy handling the Error from Shopify.Utils.loadCurrentSession and refreshing the session token on in the React app on a certain reponse from the server. I just could not seem to find a way to "force" a generation of a new token through the app-bridge library capabilities.

Packages and versions

• @shopify/app-bridge @ 3.2.1
• @shopify/app-bridge-react @ 3.2.1
• @shopify/shopify-api @ 3.1.3

Platform

Should be irrelevant to the problem. My specific scenario is described above.

Regards, Delyan

[github-actions[bot]]

This issue is stale because it has been open for 60 days with no activity. It will be closed if no further action occurs in 14 days.

[mkevinosullivan]

Does this issue still exist when using the latest Node template with the latest version of the @shopify/shopify-api library (v6.2.0)?

[delyan-peev]

We have not hit it since we migrated to v6.0.1, so I hope not, haha