使用webpack-dev-server从webpack 2代理请求在docker容器中后端api

时间:2017-05-11 05:26:47

标签: docker docker-compose dockerfile webpack-dev-server webpack-2

我正在尝试使用docker容器代理我的http请求以表示在后端运行的服务器,但我在浏览器控制台中获取HTTP 504并在docker终端中跟踪错误

HPM] Error occurred while trying to proxy request /api/getData from localhost:8080 to http://localhost:3001 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)

这是我的docker-compose.yml文件

app:
 build: .
 ports:
     - "8080:8080"
 links:
    - back

back:
  build: ./server
  ports:
   - "3001:3001"

我还为每个容器提供了2个docker文件 要在一个容器中运行webpack-dev-server 2,我有以下Dockerfile

FROM node

WORKDIR /usr/src/app

ADD . /usr/src/app

RUN npm install

CMD ["npm", "run","dev"]

和我的Dockerfile运行具有我的快递服务器的容器是

FROM node

WORKDIR /usr/src/app

ADD . /usr/src/app

RUN npm install

EXPOSE 3001

CMD ["npm", "run","serve"]

请使用webpack 2版本找到我的webpack.config.js的片段并运行webpack-dev-server

//.... all required dependency for webpack
devServer: {
 host:'0.0.0.0',
    contentBase: path.join(__dirname, "dist"),
    compress: false,
    proxy: {
    "/api": {
        "target": "http://0.0.0.0:3001",
        "secure": false
      },
    },
    hot:true
  },
  devtool: 'inline-source-map',
  // ...all required plugins and moduloes for compiling my app

我正在使用以下命令

在package.json中运行我的应用程序
"scripts": {
   "serve": "nodemon server/server.js --ignore components",
   "dev": "webpack-dev-server",
}

我还提到了以下链接 which uses webpack 1 但是webpack2现在不记录链接中列出的参数。此外,我尝试使用其他参数,但它没有用。

webpack 2也提供了任何更改Origin参数来代理请求,因为我认为webpack dev服务器在webpack 1中没有changeOrigin参数来考虑原点是相同的。

任何帮助将不胜感激。

提前致谢。

1 个答案:

答案 0 :(得分:4)

只需发布答案,就可以像我这样的人使用。我将我的请求代理到容器名称而不是webpack config中的localhost。小傻傻的错误,但我花了很长时间才弄明白。

 proxy: {
  "/api": {
    "target": "http://back:3001", //back is the service name in which my node server is running. refer docker-compose.yml
    "secure": false
  },
},