Authorization header with access token not included on useHttp() calls in SSR context.

[marcusaram]

I did configure nuxt-alt/auth with our own OpenID server with OpenID Connect. That is now up and running. But we found that the http calls using nuxt-alt/http on the server when using SSR do miss the Authorization: Bearer header, and causes the backend (proxied through nuxt-alt/rpxy) to return 401 (what is of course obvious).

Is there something what I miss?

[Denoder]

I've updated the nuxt-alt/http module check to see if that works for you

[marcusaram]

I updated to 1.7.5 but no luck, still same behavior.
This are the headers from client side to the backend:

{'Content-Length': '', 'Content-Type': 'text/plain', 'Host': 'localhost:8000', 'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64; rv:122.0) Gecko/20100101 Firefox/122.0', 'Accept': 'application/json, text/plain, */*', 'Accept-Language': 'en-US,en;q=0.5', 'Accept-Encoding': 'gzip, deflate, br', 'Referer': 'http://localhost:3000/domains', 'Authorization': 'Bearer <jwt-access-token>; auth._id_token_expiration.oidc=1707247542000', 'Sec-Fetch-Dest': 'empty', 'Sec-Fetch-Mode': 'cors', 'Sec-Fetch-Site': 'same-origin', 'X-Forwarded-For': '127.0.0.1', 'X-Forwarded-Port': '44498', 'X-Forwarded-Proto': 'IPv4'}

And this are the headers from SSR call:

{'Content-Length': '', 'Content-Type': 'text/plain', 'Host': 'localhost:8000', 'Connection': 'close', 'Accept': '*/*', 'Accept-Language': '*', 'Sec-Fetch-Mode': 'cors', 'User-Agent': 'node', 'Accept-Encoding': 'gzip, deflate', 'X-Forwarded-For': '127.0.0.1', 'X-Forwarded-Port': '58780', 'X-Forwarded-Proto': 'IPv4'}

This is the call const {data: domains, pending: domainsPending} = useHttp('services/domains/'). Also tried with $http but that also didn't work.

[Denoder]

What does your config look like

[marcusaram]

// https://nuxt.com/docs/api/configuration/nuxt-config
import vuetify, { transformAssetUrls } from 'vite-plugin-vuetify'

export default defineNuxtConfig({
  devtools: { enabled: true },
  build: {
    transpile: ['vuetify'],
  },
  ssr: true,
  modules: [
    '@nuxt-alt/auth',
    '@nuxt-alt/http',
    '@nuxt-alt/proxy',
    '@pinia/nuxt',
    (_options, nuxt) => {
      nuxt.hooks.hook('vite:extendConfig', (config) => {
        // @ts-expect-error
        config.plugins.push(vuetify({ autoImport: true }))
      })
    },
    //...
  ],
  vite: {
    vue: {
      template: {
        transformAssetUrls,
      },
    },
  },
  // Auth config
  auth: {
    globalMiddleware: true,
    enableMiddleware: true,
    strategies: {
      oidc: {
        scheme: 'openIDConnect',
        clientId: '<client id>,
        endpoints: {
          token: 'https://<auth server>/application/o/token/',
          configuration: 'https://<auth server>/application/o/portal/.well-known/openid-configuration',
        },
        idToken: {
          property: 'id_token',
          maxAge: 60 * 60 * 24 * 30,
          prefix: '_id_token.',
          expirationPrefix: '_id_token_expiration.'
        },
        responseType: 'code',
        grantType: 'authorization_code',
        scope: ['openid', 'email', 'profile'],
        // scope: 'openid',
        acrValues: 'goauthentik.io/providers/oauth2/default',
        codeChallengeMethod: 'plain',
      }
    }
  },
  // Proxy config
  proxy: {
    proxies: {
      '/api': {
        target: process.env.BACKEND_URL || 'http://localhost:8000',
        changeOrigin: true,
      },
    },
  },
  // HTTP config
  http: {
    prefix: '/api/',
    browserBaseURL: '/api/',
    // baseURL: '/api/',
  },

})

Edit: Added whole config

[Denoder]

update the http module again

[marcusaram]

Running with @nuxt-alt/http 1.7.6 but still the same. I can take a look / debug for myself but I have no idea where to look 😄

Found also some other quirk, the get token http call on the client side doesn't take account the prefix parameter, the oidc configuration http call does.

Also no pressure, I got everything working without SSR. SSR is no requirement for this project.

[Denoder]

I'm completely unfamiliar with openid, I've only dealt with oauth and the local auth.

If you're trying to find the headers during proxy you'd do something like:

proxy: {
    proxies: {
        '/api': {
            target: '<url>',
            configure: (proxy) => {
                proxy.on('proxyReq', (proxyReq) => {
                    console.log(proxyReq)
                })
            }
        },
    }
},

and try to see what headers are there.

Can you elaborate more on this:

Found also some other quirk, the get token http call on the client side doesn't take account the prefix parameter, the oidc configuration http call does.

it very well could be something I forgot to take into account with the refactor I did.

[Denoder]

I've updated the http module to handle debugging in the nitro portion of nuxt.