shopify-api-js
shopify-api-js copied to clipboard
I have a problem with " Cannot complete OAuth process. Could not find an OAuth cookie for shop url"
I was following the shopify tutorial https://www.youtube.com/watch?v=oKGR9RVCUDs And I got the following error when I wanted to go to the start of my application
` const express = require('express'); const dotenv = require('dotenv'); const { Shopify } = require('@shopify/shopify-api');
dotenv.config(); const host = 'localhost'; const port = 3000;
const { SHOPIFY_API_KEY, SHOPIFY_API_SECRET, SHOPIFY_API_SCOPES, HOST } = process.env; const shops = {};
Shopify.Context.initialize({ API_KEY: SHOPIFY_API_KEY, API_SECRET_KEY: SHOPIFY_API_SECRET, SCOPES: SHOPIFY_API_SCOPES, HOST_NAME: HOST, IS_EMBEDDED_APP: true, });
const app = express();
app.get('/', (req, res) => {
if (typeof shops[req.params.shop] !== 'undefined') {
res.send('Hello, world');
} else {
res.redirect(/auth?shop=${req.query.shop});
}
});
app.get('/auth', async (req, res) => { const authRoute = await Shopify.Auth.beginAuth( req, res, req.query.shop, '/auth/callback', false ); res.redirect(authRoute); });
app.get('/auth/callback', async (req, res) => { const shopSession = await Shopify.Auth.validateAuthCallback( req, res, req.query ); console.log(shopSession);
shops[shopSession.shop] = shopSession;
console.log(shops);
res.redirect(`https://${shopSession.shop}/admin/apps/payments-14`);
});
app.listen(port, () => {
console.log(Server runing at https://${host}:${port});
});
`
I was hitting the same issue, until i realised that i was starting the auth flow using the localhost:3000 URL and then the auth callback route was hitting my public ngrok URL.
You need to start and end the auth flow on the same URL for the oAuth cookie to be set and read correctly on the same domain.
@lukeclifton I'm also experiencing this issue. Can you elaborate on how you solved it? Not sure I follow what you wrote.
@johnciprian Are you using ngrok for the oAuth redirects?
@johnciprian Are you using ngrok for the oAuth redirects?
@lukeclifton Yes I am.
@johnciprian Are you running your application and kicking off the oAuth flow using your ngrok URL?
If you use something like localhost:3000 to start the oAuth flow and then it redirects to the ngrok URL you will see the Cannot complete OAuth process. Could not find an OAuth cookie for shop url error as the cookie will be set for the wrong URL.
@lukeclifton That's exactly what's happening to me. This just started happening. When I run npm run dev it use to give me a URL pointing to ngrok. Now the same command only points to local host. I wonder what I'm doing wrong. 🤔
👋🏻 The latest version of the CLI (v3.13) now uses localhost instead of bringing up a tunnel for the dev command.
If you want to continue using tunnels, run npm run dev --tunnel.
In order to use localhost (now supported), you'll likely have to clear your session storage and the shopify_* cookies so it starts working again.
Note that if your app development/testing includes registering and use of webhooks, you must use --tunnel.
Reference: https://shopify.dev/apps/tools/cli/commands#dev