无法使用webpack-dev-server在{{docker} -compose}上下文中使用nginx

问题描述

我正在玩docker-compose和Nginx，在这两个地方我都很新。我有一个前端容器和一个后端容器，我想使用Nginx代理到两个应用程序之间的请求。因此，我建立了一个最小的Dockerfile，

FROM Nginx:latest
copY ./default.conf /etc/Nginx/conf.d/default.conf
EXPOSE 80 443

和最小的default.conf

upstream fibclient {
  server fibclient:9000;
}

upstream fibserver {
  server fibserver:8080;
}

server {
  listen 80;

  location / {
    proxy_pass http://fibclient;
  }

  location /api {
    rewrite /api/(.*) /$1 break;
    proxy_pass http://fibserver;
  }
}

将Nginx带入我的docker-compose文件中，以下是代码段：

version: '3'
services:
  ...
Nginx:
  restart: always
  build:
    dockerfile: Dockerfile.dev
    context: ./Nginx
  ports:
    - '8000:80'
  depends_on:
    - fibclient
    - fibserver
fibserver:
  ...
fibclient:
  ...

好吧，我原本希望Nginx将请求代理到两个应用程序，正如我在default.conf中指出的那样，但是我在尝试获取Invalid host header时遇到了localhost:8000错误。我阅读了数篇文章和资源来解决此问题，但目前还不走运。我想念什么？

更新：可能是webpack问题吗？也许webpack-dev-server（版本^3.11.0）无法解决来自Nginx实例的请求？这是我的webpack.config.js文件：

const path = require('path');
module.exports = {
  entry: './src/index.js',module: {
    rules: [{
      test: /\.js$/,exclude: /\/node_modules\//,use: {
        loader: 'babel-loader'
      }
    }]
  },output: {
    filename: 'index.js',path: path.resolve(__dirname,'bin'),},devServer: {
    contentBase: path.join(__dirname,compress: true,port: 9000,host: '0.0.0.0'
  }
};

我只是以这种方式启动的："start": "webpack-dev-server"。

哦，如果您想看一看所有内容，here可以找到，谢谢。

解决方法

应该将server_name添加到：

server {
  listen 80;
  server_name localhost;

,

最后，我可以再次放手。事实证明，这不是我如何配置nginx的问题，而是容器化的webpack-dev-server，只需在我的host: '0.0.0.0',disableHostCheck: true中添加webpack.config.js参数。这是相关的部分：

devServer: {
  contentBase: path.join(__dirname,'bin'),compress: true,port: 9000,host: '0.0.0.0',disableHostCheck: true
}