Adding helmet config to express app causing 502

Question

We have a full stack of Js apps running on the cloud using Kubernetes.

We have:

• Vue3, nuxt3 front-end which uses SSR ( renders from its own server)
• Node express backend
• Keycloak authentication instance, also running on the cloud
• Keycloak and front-end have reverse proxies on the Ingresses
• All front-end apps are under one domain, as subdomains

I am trying to add Helmet - to make the headers from the backend more secure. The first is the content security policy.

export const helmetcontentSecurityConfig = helmet.contentSecurityPolicy({
   directives: {
   ...helmet.contentSecurityPolicy.getDefaultDirectives(),
   'default-src': ["'my.cloud.domain.io'"],
   'connect-src': ["'my.cloud.domain.io'"]
   }
});

As soon as I add this the callback from the node app during the authorisation process so /my-api/callback the Vue app breaks, this occurs during the code exchange step, where the backend exchanges a code for a token from keycloak - so a request to keycloak. At this moment the front-end returns a 502 bad gateway.

What I have tried so far:

• check for conflicting headers in the NGINX - I don't think there are any that conflicts - seems to be standard config

  annotations:
   cert-manager.io/cluster-issuer: letsencrypt-prod
   kubernetes.io/ingress.class: "nginx"
   nginx.ingress.kubernetes.io/proxy-buffer-size: "128k"
   nginx.ingress.kubernetes.io/server-snippets: |
     location /login {
     proxy_set_header Upgrade $http_upgrade;
     proxy_http_version 1.1;
     proxy_set_header X-Forwarded-Host $http_host;
     proxy_set_header X-Forwarded-Proto $scheme;
     proxy_set_header X-Forwarded-For $remote_addr;
  

• check for errors on the keycloak side, which is no doubt causing the error

   [error] 3957#3957: *40174453 upstream sent too big header while reading response header from upstream, client: 84.243.49.162, server: my.cloud.domain.io, request: "GET /my-api/v1/auth/callback?
  

• I have also tried with the default settings so:

   'default-src': ["'self'"],
   'connect-src': ["'self"]
  

• I have check the default keycloak settings for the cloud - can't see anything that may conflict with the headers.

       - name: KC_FEATURES
         value: token-exchange
  
       - name: KC_HEALTH_ENABLED
         value: "true"
  
       - name: KC_HOSTNAME_STRICT
         value: "false"
  
       - name: KC_METRICS_ENABLED
         value: "true"
  
       - name: KC_HOSTNAME_STRICT_HTTPS
         value: "false"
  
       - name: KC_HTTP_ENABLED
         value: "true"
  
       - name: KC_HTTP_RELATIVE_PATH
         value: /login
  
       - name: KC_PROXY
         value: "edge"
  

Any tips for how to go about this, for someone with minimal cloud/networking knowledge?

Another thing is, how important it would be to configure helmet on the nuxt3 app instead - or use both? Since this has its own server.

Nuxt Helmet

Answer 1

Have you set the Express trust proxy setting? This is highly configurable and will have an impact on Helmet. For example:

app.set('trust proxy', 1); // < Trust the first proxy

If true, the client’s IP address is understood as the left-most entry in the X-Forwarded-For header.