Vue-router history模式下Nginx配置
2019-02-28 本文已影响0人
mocobk
对于VUE的router[mode: history]模式(这里主要是为了去除链接上的"#")
开发的时候,一般都不出问题。是因为开发时用的服务器为node,Dev环境中已配置好了,
nginx运行的时首页没有问题,链接也没有问题,但在点击刷新后,页面就会显示(404)
原配置:
location / {
root /home/testhadoop/www/html;
index index.html index.htm;
}
解决方案如下:
方案一:
使用try_files
语法:try_files file1 [file2 ... filen] fallback
location / {
root /home/testhadoop/www/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
方案二:
使用try_files
location /{
root /home/testhadoop/www/html;
index index.html index.htm;
if (!-e $request_filename) {
rewrite ^/(.*) /index.html last;
break;
}
}
方案三:
使用error_page (一般不建议用, 404的方式会被第三方劫持)
location /{
root /home/testhadoop/www/html;
index index.html index.htm;
error_page 404 /index.html;
}