我在 Nginx Web 服务器上部署了一个 React 应用程序。当我使用 URL XX.XX.XX.XX 访问应用程序时,React 应用程序可以正常工作。但是,我想使用 URL XX.XX.XX.XX/myapp/frontend
访问该应用程序。我已经配置了nginx反向代理将所有请求重定向到路径/myapp/frontend
.
nginx 配置文件
server {
listen 80 default_server;
server_name localhost;
root /var/www/myapp/myapp-frontend;
index index.html index.htm;
location / {
}
location /myapp/frontend {
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}
对于要使用 url XX.XX.XX.XX/myapp/frontend
访问的应用程序我必须告诉 react 应用程序从路径 /myapp/frontend
开始。
编辑:
我指定了“主页”:“http://XX.XX.XX.XX/myapp/frontend”,以便React应用程序从位置/myapp/frontend
启动.
当我尝试访问该 URL 时,出现黑页。检查页面后,调用 http://XX.XX.XX.XX/myapp/frontend/static/css/1.5a6735dd.chunk.css
我得到502 Bad Gateway
。所以静态文件没有被访问。我该如何解决这个问题?
最佳答案
你可以在src文件中设置'setupProxy.js'
代码是:
const proxy = require("http-proxy-middleware");
module.exports = function(app) {
app.use(proxy("/auth/google", { target: "http://localhost:5000/" }));
app.use(proxy("/api/*", { target: "http://localhost:5000/" }));
};
关于javascript - React 应用程序寻找未被访问的静态文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55304669/