[🐞] Auth.js signIn works in dev but not in production ( cloud run) - CSRF check failed.

[robertwach]

Which component is affected?

Qwik Runtime

Describe the bug

Auth sign in with github/google works perfectly on dev but when hosted on cloud run there is an error on csrf

403 CSRF check failed. Cross-site POST form submissions are forbidden. The request origin "null" does not match the server origin "https://marketlog-csoghepddq-uc.a.run.app".

, "@builder.io/qwik": "^1.2.6", , "@builder.io/qwik-city": "^1.2.6",

const signIn = useAuthSignin Sign in form

Reproduction

Steps to reproduce

No response

System Info

System:
    OS: macOS 13.4.1
    CPU: (8) x64 Intel(R) Core(TM) i5-1038NG7 CPU @ 2.00GHz
    Memory: 34.45 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 16.18.1 - /usr/local/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 8.19.2 - /usr/local/bin/npm
    pnpm: 8.4.0 - ~/Library/pnpm/pnpm
  Browsers:
    Brave Browser: 114.1.52.126
    Chrome: 114.0.5735.198
    Safari: 16.5.1
  npmPackages:
    @builder.io/qwik: ^1.2.6 => 1.2.6 
    @builder.io/qwik-auth: ~0.1.0 => 0.1.0 
    @builder.io/qwik-city: ^1.2.6 => 1.2.6 
    undici: 5.22.1 => 5.22.1 
    vite: 4.3.5 => 4.3.5 

    @auth/core": "^0.9.0"

Additional Information

No response

[leifermendez]

maybe this will be useful for you. https://github.com/BuilderIO/qwik/issues/4715

[robertwach]

@leifermendez the solution given there ( adding ORIGIN) does not work unfortunately.

[maiieul]

Have you set up your env vars properly in production?

[robertwach]

Have you set up your env vars properly in production?

Env variables perfectly configured

[maiieul]

Seems that CSRF is being skipped by qwik-auth for some reason. Maybe it was because CSRF check was considered useless in the context of Qwik applications, or they didn't manage to make Qwik work with it.

See https://authjs.dev/reference/core#skipcsrfcheck for reference.

I think this is probably an issue with cloud run. Did you deploy with npm run qwik add cloud-run? Perhaps you could try another deployment platform like Vercel and see if it works. It might take some time for Auth.js to be at v1, and CSRF check might depend on it too.

[maiieul]

Seems that CSRF is being skipped by qwik-auth for some reason. Maybe it was because CSRF check was considered useless in the context of Qwik applications, or they didn't manage to make Qwik work with it.

Qwik City already checks CSRF on actions so there's no need to check it twice. Issue here is ORIGIN is not set (null).

Could you point us to where you got this information? It's nowhere in the docs. Is this function responsible for it?

[robertwach]

ORIGIN

An env var ORIGIN has already been set plus other suggested vars that could solve the issue.

[ulic75]

I created a basic qwik app and added github auth using the qwik-auth plugin and published it to gcr without any issues (other than striping out some of the content security because I didn't want to fight with it, but I never saw the above issue).

https://github.com/ulic75/qwik-cloudrun-auth https://my-cloud-run-app-wdl72b3taa-uw.a.run.app/

[robertwach]

After more investigation I realised that the issue could be caused by the fact that I was deploying from github and not using the "npm run deploy".

Secondly I found out the same repo if deployed from github to a node server (express/fastify) auth works perfectly.

I also found that when you are using prisma and deploying to cloud run using "npm run deploy" cmd, theres is a bug with postinstall and the process fails, but same deployment to node server (digital ocean etc) works just fine.

[jmsegrev]

I'm having exact same problem with a newly created starter basic app, no changes, just adding the adapter as described in the cloud-run deployment section in the docs. If I try to add an item in the todo, I get the same error. https://my-cloud-run-app-hduccgoloq-ue.a.run.app/demo/todolist/

[gioboa]

We recently released a new version of this library to solve few issues. Is the new version solving your issue?

[github-actions[bot]]

Hello @robertwach. Please provide the missing information requested above. Issues marked with STATUS-2: missing info will be automatically closed if they have no activity within 14 days. Thanks 🙏

[rpdave]

Hey everyone I am facing the same issue and I am not sure how to resolve it.

Reproduce: Please see this repo - https://github.com/rpdave/qwik-cloud-auth

Steps:

• git clone [email protected]:rpdave/qwik-cloud-auth.git
• pnpm i
• pnpm run build
• pnpm run start.server
• Open localhost:8080
• Click SignIn

You will see this error page

I tried a lot of things and ultimately my understanding is this error is thrown before even any AuthJS framework code can be reached the qwik server middleware is kicking this request off as 403 because the origin header is null and I am not able to understand why you can see the below headers list as I logged it in the console

REQUEST HeadersList {
  cookies: null,
  [Symbol(headers map)]: Map(20) {
    'accept' => {
      name: 'accept',
      value: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7'
    },
    'accept-encoding' => { name: 'accept-encoding', value: 'gzip, deflate, br, zstd' },
    'accept-language' => {
      name: 'accept-language',
      value: 'en-AU,en-GB;q=0.9,en;q=0.8,en-US;q=0.7'
    },
    'cache-control' => { name: 'cache-control', value: 'max-age=0' },
    'connection' => { name: 'connection', value: 'keep-alive' },
    'content-length' => { name: 'content-length', value: '40' },
    'content-type' => {
      name: 'content-type',
      value: 'application/x-www-form-urlencoded'
    },
    'cookie' => {
      name: 'cookie',
      value: 'authjs.csrf-token=f5395912647e18d01c887a830608d36a555f743d152df2aba8fd5298b200ea32%7Ce805b419efdcea523df1ad59f686a84e932034f66f226e46ea56899767902e0e; authjs.callback-url=http://localhost:8080/'
    },
    'dnt' => { name: 'dnt', value: '1' },
    'host' => { name: 'host', value: 'localhost:8080' },
    'origin' => { name: 'origin', value: 'null' }, // NOTE: This is the issue
    'sec-ch-ua' => {
      name: 'sec-ch-ua',
      value: '"Chromium";v="128", "Not;A=Brand";v="24", "Microsoft Edge";v="128"'
    },
    'sec-ch-ua-mobile' => { name: 'sec-ch-ua-mobile', value: '?0' },
    'sec-ch-ua-platform' => { name: 'sec-ch-ua-platform', value: '"macOS"' },
    'sec-fetch-dest' => { name: 'sec-fetch-dest', value: 'document' },
    'sec-fetch-mode' => { name: 'sec-fetch-mode', value: 'navigate' },
    'sec-fetch-site' => { name: 'sec-fetch-site', value: 'same-origin' },
    'sec-fetch-user' => { name: 'sec-fetch-user', value: '?1' },
    'upgrade-insecure-requests' => { name: 'upgrade-insecure-requests', value: '1' },
    'user-agent' => {
      name: 'user-agent',
      value: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36 Edg/128.0.0.0'
    }
  },
  [Symbol(headers map sorted)]: null
}

UPDATE: setting checkOrigin: false, in entry.cloud-run.tsx makes no difference =( Clicking the signin button just loads the same page again. I think there is perhaps an issue with the cloud run adapter, not sure.

UPDATE: Adding an adapter like express works just fine.

[rpdave]

My latest findings are

in entry.cloud-run.tsx if you remove the following CSP headers

`default-src 'self'`
`script-src 'self'`

The login works and we dont see the CSRF error. Also the effect is that the URL for calling the action changes in the network tab

With above CSP Headers the URL invoked is http://localhost:8080/?qaction=xjVnyrcqS90 Without above CSP Headers the URL invoked is http://localhost:8080/q-data.json?qaction=xjVnyrcqS90

Notice the q-data.json

I am hoping that someone with more knowledge than me can understand this difference and point out why this might happen. I will also continue to investigate in the meantime.

I dont think removing the headers is a solution and so need to understan why those default headers are causing this behaviour.

[rpdave]

This issue is directly linked to https://github.com/QwikDev/qwik/issues/4423