Enable cookies redirection loop - koa-shopify-auth

[Popesites]

Overview

I've been experiencing a number of issues with the authentication process for my app since updating the shopify koa auth package to 3.1.36.

One of these issues is the following ⁠—

On Safari, when I open a fresh browser window with no cookies / cache at all, sign into my Shopify store, and open up my app, I am sent to a redirection loop.

Here's what it looks like:

Enable cookies page (https://<app_domain>/auth/enable_cookies) -> click "Enable Cookies" -> user gets redirected to https://<app_domain>/admin/apps/<some_hash> -> user gets redirected to https://<app_domain>/auth/enable_cookies again

Consuming repo

What repo were you working in when this issue occurred?

https://github.com/Shopify/quilt/tree/master/packages/koa-shopify-auth

[Popesites]

Here is a video displaying this behavior:

[noctivityinc]

@Popesites were you able to figure this out? Im seeing the same thing.

[Popesites]

@noctivityinc nope, still nothing.

[gil--]

Started noticing this on Safari iOS 13 where it'll redirect back and forth between the cookie screen and the app in the admin. Going to try to look into this soon as it seems to be affecting merchants.

[dimapaloskin]

I faced this problem and looks like this bug related to new SameSite behavior.

Looks like we need to use SameSite=None; Secure attributes for sharing cookies. I tried to force these attributes for every cookie and its fixed infinity loop.

Still investigating.

[justjoeyuk]

@dimapaloskin how did you force these attributes?

[dimapaloskin]

@justjoeyuk It's not approach for production.

Clone https://github.com/pillarjs/cookies repo, change cookies sameSite setup manually (header += "; samesite=none"), and link the package to project.

Note, you need to use https (or at least have X-Forwarded-Proto: https header), because koa detect secure flag automatically.

BTW, I'm working on the PR to koa-shopify-auth right now to fix the problem.

[justjoeyuk]

@dimapaloskin This redirection loop also appears to happen on Safari on Mac OS 😕

[dimapaloskin]

@justjoeyuk Unfortunately I can't reproduce this bug in safari. What versions of safari and mac os you use?

Does an infinity loop occur with the SameSite=None; Secure?

[dimapaloskin]

Probably it will help someone.

Currently I use monkey patch to replace cookies in runtime. It should be first middleware in the chain:

app.use((ctx, next) => {
  const cookies = new Cookies(ctx.req, ctx.res, {
    keys: app.keys,
    secure: true,
  });

  const originalCookieSet = cookies.set.bind(cookies);

  const patched = function set(name, value, opts) {
    const patch = { sameSite: 'none' };
    const patchedOpts = opts ? { ...opts, ...patch } : patch;
    return originalCookieSet(name, value, patchedOpts);
  };

  cookies.set = patched.bind(cookies);
  ctx.cookies = cookies;
  return next();
});

[sskhokhar]

@dimapaloskin Which "Cookies" package are you using?

[RavenHursT]

Probably it will help someone.

Currently I use monkey patch to replace cookies in runtime. It should be first middleware in the chain:

app.use((ctx, next) => {
  const cookies = new Cookies(ctx.req, ctx.res, {
    keys: app.keys,
    secure: true,
  });

  const originalCookieSet = cookies.set.bind(cookies);

  const patched = function set(name, value, opts) {
    const patch = { sameSite: 'none' };
    const patchedOpts = opts ? { ...opts, ...patch } : patch;
    return originalCookieSet(name, value, patchedOpts);
  };

  cookies.set = patched.bind(cookies);
  ctx.cookies = cookies;
  return next();
});

Holy crap! This worked!

Thank you!!!

[github-actions[bot]]

Note that this repo is no longer maintained and this issue will not be reviewed. Prefer the official JavaScript API library. If you still want to use Koa, see simple-koa-shopify-auth for a potential community solution.