使用nginx部署Vue项目,刷新出现404
1. 问题描述按照 若依框架前后端项目分离部署(jar包+Nginx部署)这篇博客的教程将若依项目部署到服务器上,可以访问,但是一刷新就会出现4042. 解决修改配置文件worker_processes1;events {worker_connections1024;}http {includemime.types;default_typeapplication/octet-stream;send
·
1. 问题描述
- 按照 若依框架前后端项目分离部署(jar包+Nginx部署)这篇博客的教程将若依项目部署到服务器上,可以访问,但是一刷新就会出现404
2. 解决
- 修改配置文件
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80; # 浏览器上访问的接口
server_name localhost;
#root html/dist; 尽量不要把dist文件夹放在nginx中
root c:/html/dist; # 将dist放在c盘html目录下
location / {
#需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404
try_files $uri $uri/ @router;
index index.html index.htm;
}
location /prod-api/{
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8080/; # 后端接口
}
#对应上面的@router,主要原因是路由的路径资源并不是一个真实的路径,所以无法找到具体的文件
#因此需要rewrite到index.html中,然后交给路由在处理请求资源
location @router {
rewrite ^.*$ /index.html last;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}
更多推荐
已为社区贡献3条内容
所有评论(0)