[英]Webpack Dev Server with NGINX proxy_pass
我正在嘗試讓webpack-dev-server
在Docker容器內運行,然后通過NGINX主機訪問它。 初始index.html
加載但與開發服務器的Web套接字連接無法連接。
VM47:35與'ws://example.com/sockjs-node/834/izehemiu/websocket'的WebSocket連接失敗:WebSocket握手期間出錯:意外響應代碼:400
我正在使用以下配置。
map $http_upgrade $connection_upgrade {
default upgrade;
'' close;
}
upstream webpack_dev_server {
server node;
}
server {
server_name _;
listen 80;
root /webpack_dev_server;
location / {
proxy_pass http://webpack_dev_server;
}
location /sockjs-node/ {
proxy_pass http://webpack_dev_server/sockjs-node/;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host; # pass the host header - http://wiki.nginx.org/HttpProxyModule#proxy_pass
proxy_http_version 1.1; # recommended with keepalive connections - http://nginx.org/en/docs/http/ngx_http_proxy_module.html#proxy_http_version
# WebSocket proxying - from http://nginx.org/en/docs/http/websocket.html
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $connection_upgrade;
}
}
代理傳遞應該是你的webpack-dev-server容器的ip和端口,你需要proxy_redirect off;
location /sockjs-node {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
proxy_set_header Host $host;
proxy_pass http://node:8080;
proxy_redirect off;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
另外,不要忘記向您的webpack-dev中間件添加poll
watchOptions: {
aggregateTimeout: 300,
poll: 1000
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.