shopOrigin must be provided- Error, Step 3 Build shopify add with Node and React Tutorial

Frankly, re-login is not the solution to this issue. Browser doesn’t find shopOrigin cookie causing the issue. There are many reasons cookie not found. You need to see Shopify development team upgraded app bridge from 3x to 4.2.x to remove 3’rd party cookie dependency via JWT session token.

To fix the problem you ran into, my former solution was to check cookie and add again if cookie not found, please see code segment in the below.

const { verifyRequest, validateHMAC } = require("@shopify/koa-shopify-auth");

  server.use(async (ctx, next) => {
        try {
            const got = ctx.cookies.get("shopOrigin");
            if (!got && ctx.request.query) {
                const { hmac, shop } = ctx.request.query;
                if (hmac && shop) {
                    const valid = validateHMAC(hmac, SHOPIFY_API_SECRET_KEY, ctx.request.query);
                    if (valid) {
                        ctx.cookies.set("shopOrigin", shop, {
                            httpOnly: false,
                            secure: true,
                            sign: true,
                            sameSite: "none"
                        });
                        ctx.redirect(`https://${shop}/admin/apps/${SHOPIFY_API_KEY}`);
                    }
                }
            }
            await next();
        } catch (err) {
            log.error(err.stack);
        }
    });
1 Like