![nginx 保留代理 docker 后面的热重新加载站点(webpack-dev-server)](https://linux22.com/image/737315/nginx%20%E4%BF%9D%E7%95%99%E4%BB%A3%E7%90%86%20docker%20%E5%90%8E%E9%9D%A2%E7%9A%84%E7%83%AD%E9%87%8D%E6%96%B0%E5%8A%A0%E8%BD%BD%E7%AB%99%E7%82%B9%EF%BC%88webpack-dev-server%EF%BC%89.png)
我尝试设置一个 nginx 容器作为在 webpack-dev-server 上运行的开发网站的代理。不幸的是,我在加载静态文件时遇到了问题(404 未找到)。
当请求到达代理服务器的index.html文件时,它会尝试在http://localhost:8081/static/js/bundle.js这不是实际位置。
这是我的index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="/manifest.json" />
<title>PowerPlan</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script src="/static/js/bundle.js"></script><script src="/static/js/0.chunk.js"></script><script src="/static/js/main.chunk.js"></script></body>
</html>
这是我的 nginx 配置:
server {
listen 80;
server_name localhost;
error_log /var/log/nginx/nginx_error.log warn;
location /power-plan/ {
resolver 127.0.0.11 ipv6=off;
proxy_pass http://host.docker.internal:3000/;
proxy_http_version 1.1;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Port $server_port;
proxy_cache_bypass $http_upgrade;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
location / {
root /usr/share/nginx/html;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}