CODEWITHSUNDEEP
shopify-appremix.run
JTR
JTR

Reputation: 345

Refresh Offline Access Token Scope - Post Install

We’re in the process of finalising our app however there’s one thing that is preventing testing, which is the fact that I have used the Shopify Remix App template, and it has the scope below:

write_products, write_themes

This is cool until you realise you need much more scope than that.

Now because I didn’t set the scope correctly before installing it on the dev store, the offline token generated has persisted, and its scope has persisted, even though the app has been re-installed and re-authed accepting additional scope.

The TOML, the app in Partners, fully reflect the new required scope, hence why when I re-install I agree to accept the new scope.

The issue is, why is this not updating the access tokens scope if I have approved the new scope? (And also, why is the access token not being deleted when the app in uninstalled?)

To ensure that the app doesn’t capitulate if for whatever reason access tokens expire and we need to ask merchants to re-auth, I added the below:

const requiredScopes = [
  "read_products",
  "write_products",
  "read_orders",
  "write_orders",
  "read_customers",
  "write_customers",
];

const currentScopes = session.scope.split(",");
const missingScopes = requiredScopes.filter(scope => !currentScopes.includes(scope));

if (missingScopes.length > 0) {
  console.log("Requesting additional scopes:", missingScopes);

  const redirectUrl = `https://${session.shop}/admin/oauth/authorize?client_id=${process.env.SHOPIFY_API_KEY}&scope=${missingScopes.join(",")}&redirect_uri=${process.env.SHOPIFY_APP_URL}/auth/callback`;

  return new Response(null, {
    status: 302,
    headers: { Location: redirectUrl },
  });
}

This is meant to push the user to re-auth if the access token in the session doesn’t include the required scope, however the redirect doesn’t work, it shows the below error: Firefox Can’t Open This Page

To protect your security, accounts.shopify.com will not allow Firefox to display the page if another site has embedded it. To see this page, you need to open it in a new window.

If I open it in a new window I see “authorisation failed”.

I can use the below method to create a new token that has the correct scope, but I have an issue with the original offline token persisting forever with the wrong scope.

curl -X POST "https:/anon.myshopify.com/admin/oauth/access_token" \
-H "Content-Type: application/json" \
-d '{
  "client_id": "03403840834bunchofnumbers030384",
  "client_secret": "30483084bunchofnumbers90348",
  "code": "0834834bunchofnumbersnadsomeletters834oi"
}'

Keen for any help on this. Also redirecting within app._index feels impossible, I’ve tried multiple methods and it doesn’t work, it’s blocked every time, if anyone has a method for that it would be great as when I detect the access token doesn’t have the correct scope, I want to redirect the user to the re-auth screen to approve the additional scope (if for whatever reason tokens refresh in the future).

Upvotes: 0

Views: 30

Answers (1)

JTR
JTR

Reputation: 345

I'm going to assume a few more people are going to run into this issue and I have the answer!

After an entire 14 hours of trying to figure this out it turns out that the /app/uninstall webhook wasn't actually deleting the session data on uninstall... Considering this is a shopify app template I'd expect that to be working but have a feeling it has something to do with the cloudflare URLs for dev mode refreshing before the webhook to delete the data is called.

Basically if you want to ever update your scope in dev mode (pre deploy) you can run:

await db.session.deleteMany({ where: { shop: session.shop } });

After:

const { session } = await authenticate.admin(request);

And it will force a new offline token to be created with the updated scope, as long as you have updated the toml file, deployed the new app to Partner dashboard and then run shopify app dev again.

Hopefully this prevents someone else spending 14 hours trying to guess why this wasn't working as unless you're familiar with Shopify Apps you're just not going to know.

Upvotes: 0

Related Questions