Cannot Server Side Render a page within a docker container on Traefik network connected to API also on the same network

Traefik Traefik v1
, ,
1

I have two applications within my traefik network. One is {mydomain} and the other is api.{mydomain}. Everything works perfectly on the client side, but the code rendered on the server side seems to not be able to request api.{mydomain}. Everything works properly on my local machine.

server.js

const express = require('express')
const next = require('next')

const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare()
    .then(() => {
        const server = express()

        server.get('/summoner/:region/:sumName', (req, res) => {
            console.log(req.params.region)
            app.render(req, res, '/summoner', { region: req.params.region, sumName: req.params.sumName })

        })

        server.all('*', (req, res) => {
            return handle(req, res)
        })

        server.listen(3000, (err) => {
            if (err) throw err
            console.log('> Ready on http://localhost:3000')
        })
    })
    .catch((ex) => {
        console.error(ex.stack)
        process.exit(1)
    })

Dockerfile

FROM node:10-alpine

ENV PORT 3000

# Create app directory
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app

# Install app dependencies
COPY package*.json /usr/src/app/
RUN npm install

# Bundle app source
COPY . /usr/src/app

RUN npm run build
EXPOSE 3000

CMD [ "npm", "run" "start" ]

docker-compose.yaml

version: "3"

networks:
  web:
    external: true
  internal:
    external: false

services:
  front:
    build: ./frontend
    labels:
      - traefik.backend=frontend
      - traefik.frontend.rule=Host:{my domain name}
      - traefik.docker.network=web
      - traefik.port=3000
    networks:
      - internal
      - web
  api:
    build: ./api
    labels:
      - traefik.backend=api
      - traefik.frontend.rule=Host:api.{my domain name}
      - traefik.docker.network=web
      - traefik.port=8080
    networks:
      - internal
      - web
2

My code that is freezing everything is as follows

static async getInitialProps({ query }) {
        const res = await fetch(`https://api.{my domain name}/v1/${query.region}/tft/${encodeURIComponent(query.sumName)}`);
        const data = await res.json();
        return {
            player: data
        }
    }
3

Hi @nkhodanian, what is HTTP request emitted by the fetch ? what is the response ? (use curl --verbose --location --silent <...> to simulate the request.

Did you use a node.js debugger to see exactly what is blocking in your setup? You might want to do this - ref. https://blog.risingstack.com/how-to-debug-a-node-js-app-in-a-docker-container/ :slight_smile:

4

Same issue here, have you find a solution?, despite the fact it been a looong time!