CODEWITHSUNDEEP
dockerdocker-composenuxt.jsnestjs
Ron Al
Ron Al

Reputation: 476

Nuxt.js 500 NuxtServerError under docker-compose

my system contains 3 dockers:

  1. mongodb
  2. api backend, built with Nestjs
  3. web application, build with Nuxt.js the mongo and the backend seems to be working, because i can access the swagger at localhost:3000/api/. the Nuxtjs web app is failing, and i'm getting 500 Nuxtserver error.
Dockerfile (for the web app):
FROM node:12.13-alpine

ENV APP_ROOT /src

RUN mkdir ${APP_ROOT}
WORKDIR ${APP_ROOT}
ADD . ${APP_ROOT}

RUN npm install
RUN npm run build

ENV HOST 0.0.0.0
EXPOSE 4000

docker-compose.yml:
version: "3"
services:
  # backend nestjs app
  api:
    image: nestjs-api-server
    container_name: my-api
    depends_on:
      - db
    restart: unless-stopped
    
    environment:
      - NODE_ENV=production
    ports:
      - 3000:3001
    networks:
      - mynet
    links:
      - db

  # mongodb
  db:
    image: mongo
    container_name: db_mongo
    restart: unless-stopped
    volumes: 
      - ~/data/:/data/db
    ports: 
      - 27017:27017
    
    networks:
      - mynet
   

  # front web app, nuxt.js
  web:
    image: nuxtjs-web-app
    container_name: my-web
    depends_on:
      - api
    restart: always
    ports:
      - 4000:4000
    environment:
      - BASE_URL=http://localhost:3000/api
    command:
      "npm run start"

    networks:
      - mynet

    
networks:
  mynet:
    driver: bridge

Looks like the nuxtjs app cannot connect to the api. in the log i see:

ERROR  connect ECONNREFUSED 127.0.0.1:3000

But why? the swagger (coming from the same api) works fine on http://localhost:3000/api/#/. Any idea?

Upvotes: 0

Views: 806

Answers (2)

Ron Al
Ron Al

Reputation: 476

Got it. The problem was in nuxtServerInit. This is a very special method on vuex, and it is running in the server. i called $axios from it, and i guess you can't do that. once i commented that method, it's working fine.

Upvotes: 0

Achu
Achu

Reputation: 364

environment:
  - BASE_URL=http://localhost:3000/api

localhost in a container means inside that particular container. i.e., it will try to resolve port 3000 in my-web container itself.

Basically from front-end you cannot do container communication. May be you can communicate via public hostname or ip or you can make use of extra_hosts concept in docker-compose to resolve localhost.

Upvotes: 1

Related Questions