Future: Server side rendering causes api calls to fail

[maxtrap]

Since next.js is doing server-side rendering, it is making calls to the api inside the container.

This means that when this resource is fetched: http://localhost.pwn.college/pwncollege_api/v1/dojos it tries to resolve localhost.pwn.college from inside the container, which fails.

I was able to fix it using this code:

const isServer = typeof window === 'undefined'

const url = isServer
  ? `http://nginx/pwncollege_api/v1${endpoint}`
  : `${this.baseUrl}${endpoint}`

so that all server-side requests are done using appropriate docker container names instead of localhost.

It seems like it works just fine on production, so I have no idea why I have this issue locally. What is the correct way to fix this issue? Is the best solution to just target server-side calls towards the nginx container?