Cockpit + SSR App (CORS issue)

Support
1

Hi!

My problem is the following:
I have installed Cockpit on https://api.domain.com and my Nuxt.js frontend application is on https://domain.com. Both projects and a webserver with reverse proxy set up (nginx-proxy + acme-companion) are in Docker containers. Whenever i start my frontend container, i get the following errors:

ERROR  connect ETIMEDOUT X.X.X.X:443
at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1138:16)

WARN  Cannot stringify a function transformRequest
WARN  Cannot stringify a function transformResponse
WARN  Cannot stringify a function httpAdapter
WARN  Cannot stringify a function validateStatus
WARN  Cannot stringify arbitrary non-POJOs Writable
WARN  Cannot stringify a function toJSON

I’m sending requests from server-side (using Nuxt’s fetch method) with Axios, so it turns out that this causing the problem. When i send the request from client-side or from a local environment, all requests work as expected.

I tried disabling CORS with the following config:

cors:
  allowedHeaders: ''
  allowedMethods: ''
  allowedOrigins: 'null'
  maxAge: '1000'
  allowCredentials: 'false'
  exposedHeaders: 'false'

Did not work.

@artur @raffaelj @pauloamgomes - or anybody else, what do you think? Is it a CORS related issue? How can i get it work?

Thanks in advance!

2

Anybody? Any idea? :woozy_face:

3

Finally, i figured it out on my own.

I had to set up publicRuntimeConfig and privateRuntimeConfig (Nuxt) variables with different environmental variables to let the Axios module know which request is going to server-side/client-side. For example, my Cockpit docker service is available on a shared network like this: http://cms, so i set a privateRuntimeConfig (which is only available on server-side) variable for the init/server-side requests and one publicRuntimeConfig with the API’s public address (e.g. https://api.domain.com) if some data needs to be fetched on the go.

Hope this will help someone with similar problems.

1 Like