Alex
Alex

Reputation: 434

authentication cookie not set (CORS?)

i have built a webapp with angular and a backend with nestjs. As authentication, I want to use our keycloak server (jwt token).

I'm using the OpenID Connect mechanism.

In development mode, everything works (frontend: http://localhost:4200, backend:http://localhost:3030, keycloak(production server): https://auth.domain)

The corresponding call contains the following headers:

Request URL: http://localhost:3030/v1/auth/keycloak/callback?session_state=*****
Request Method: GET
Status Code: 302 Found
Remote Address: [::1]:3030
Referrer Policy: strict-origin-when-cross-origin
Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Length: 88
Content-Type: text/html; charset=utf-8
Date: Wed, 05 Jan 2022 10:30:06 GMT
Keep-Alive: timeout=5
Location: http://localhost:4200/
Set-Cookie: Authorization=Bearer%20ey****; Path=/
Vary: Accept
X-Powered-By: Express
Accept: 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.9
Accept-Encoding: gzip, deflate, br
Accept-Language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7
Connection: keep-alive
Host: localhost:3030
sec-ch-ua: "(Not(A:Brand";v="8", "Chromium";v="100", "Google Chrome";v="100"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
Sec-Fetch-Dest: document
Sec-Fetch-Mode: navigate
Sec-Fetch-Site: cross-site
Sec-Fetch-User: ?1
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4758.9 Safari/537.36

But now I tried to deploy the backend to the production server. Its running in a docker container behind nginx proxy manager. So the call goes angular(http://localhost:4200) -> nginx proxy(https://api.domain) -> nestjs(container:3030) -> keycloak(https://auth.domain).

The call seems to be successfull, the backend logs tell me that it has successfuly received the token. Also the frontend dos not show any errors, but the cookie is not set and I don't know why.

Inscpecting the network call, everything should be fine. The set-cookie header is there, but it's just not set OR I can't access it from the browser/js (because I can't find it in the browser dev tools). Note that there it no "httpOnly" flag in my call - this seems to be a different problem.

This is the call with the production backend:

Request URL: https://api.domain/v1/auth/keycloak/callback?session_state=****
Request Method: GET
Status Code: 302 
Remote Address: 10.64.0.101:443
Referrer Policy: strict-origin-when-cross-origin
access-control-allow-credentials: true
access-control-allow-origin: *
content-length: 88
content-type: text/html; charset=utf-8
date: Wed, 05 Jan 2022 11:38:30 GMT
location: http://localhost:4200/
server: openresty
set-cookie: Authorization=Bearer%20ey***; Path=/
vary: Origin, Accept
x-powered-by: Express
x-served-by: api.mtg
:authority: api.mtg
:method: GET
:path: /v1/auth/keycloak/callback?session_state=***
:scheme: https
accept: 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.9
accept-encoding: gzip, deflate, br
accept-language: de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7
cookie: Authorization=Bearer%20eyJhbG***
sec-ch-ua: "(Not(A:Brand";v="8", "Chromium";v="100", "Google Chrome";v="100"
sec-ch-ua-mobile: ?0
sec-ch-ua-platform: "Windows"
sec-fetch-dest: document
sec-fetch-mode: navigate
sec-fetch-site: cross-site
sec-fetch-user: ?1
upgrade-insecure-requests: 1
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4758.9 Safari/537.36

I suspect that to be some kind of cors problem, but I just cant get behind it...

Upvotes: 0

Views: 3815

Answers (1)

Tore Nestenius
Tore Nestenius

Reputation: 19921

Today you will get a lot of cookie issue when cookies are sent over HTTP, due to the recently added SameSite cookie feature. Most of the important cookies used during authentication requires today HTTPS to work. The backend will send the cookies down to the browser, but the browsers will not include them if you are using HTTP.

I would recommend that you switch to HTTPS and try again.

You can in the browser see why certain cookies are rejected by:

  1. Click on the network tab and reload the page
  2. Click on the Cookies request
  3. Select the Cookies tab
  4. Then hover your mouse over the  to see the reasoning by the browser

enter image description here

To complement this answer, I wrote a blog post that goes into more detail about this topic: Debugging cookie problems

Upvotes: 1

Related Questions