How to translate webpack dev server proxy options to nginx docker container?

Question

I am deploying a docker container, which includes my webapp (app 1) to a vm. I have another docker container (app 2) on the vm that is running on port 8080 . I would like to proxy all url requests from app 1 that start with /api to app 2 .

This is my DOCKER file:

FROM nginx:1.17.0
MAINTAINER **** [**@**.com](mailto:**@**.com)

COPY nginx.default /etc/nginx/sites-enabled/default

ADD dist/ /usr/share/nginx/html/

These are my webpack dev server settings

devServer: {
    contentBase: outDir,
    // serve index.html for all 404 (required for push-state)
    historyApiFallback: true,
    proxy: {
      '/api': {
        target: 'http://aapp-name:8080',
        pathRewrite: { '^/api': '' },
        logLevel: 'debug'
      }
    }
  }

I have added the following to nginx.default , but it doesn't seem to be working.

location /api {
    proxy_pass http://app-name:8080;     
}

Answer 1

If you want to access container by name, you should place them in the same docker network.

• create docker network: docker network create <network_name>
• docker run --network <network_name> --name app2 -d -p 8080:8080 image
• docker run --network <network_name> --name app1 -d image
• access app2 service in app1 container by http://app2:8080