Nginx笔记-vue项目刷新出现404(try_files和index)

目前的nginx.conf配置:

javascript 复制代码
......

server{

    ......

    ......

    location /xxx{

        root /home/userName/dir

        index index.html

   }

}

部署是成功了,但是有个问题,就是感觉整个前端不会找uri,按F5或者在浏览器输入url都会404,只从vue默认的地方进,才行。

解决方法:

javascript 复制代码
......

server{

    ......

    ......

    location /xxx{

        root /home/userName/dir

        try_files $uri $uri/ /home/userName/dir/index.html

   }

}

原因:

index index.htm index.html;

index 就是根目录,也就是只识别"/"结尾的,输入不存在或者刷新页面的路径就直接报nginx的404了,而不会重定向到index.html

try_files 更加可靠, 首先会查找"uri"下的这个文件,如果不存在会查找uri/,如果还不存在就会重定向到 /index.html页面。如果最后参数写错了,就会导致500的服务器错误。

以前如果是没有用webpack的项目,可以直接用index,如果是用的webpack最好用try_files

相关推荐
问心无愧05131 小时前
ctf show web入门110
前端·笔记
拉拉肥_King1 小时前
Vue 3 主题切换深度解析:从炫酷动画到零闪烁方案
前端·vue.js
道一232 小时前
Windows系统查看端口占用进程的3种实用方法
windows·笔记
lunzi_08262 小时前
【学习笔记】《Python编程 从入门到实践》第8章:函数定义、参数传递与模块导入
笔记·python·学习
杨梦馨2 小时前
万级数据表格卡死?Web Worker 一招搞定
前端·javascript·vue.js
郭庆汝5 小时前
FastAPI使用笔记
笔记·fastapi
哈撒Ki5 小时前
快速入门vue3与常见面试题
前端·vue.js·面试
爱讲故事的5 小时前
计算机网络第七章:无线与移动网络复习笔记
网络·笔记·计算机网络
小陈phd5 小时前
Text2SQL智能体学习笔记(一)——NL2SQL及执行流程介绍
笔记·学习
问心无愧05135 小时前
ctf sow web入门112
android·前端·笔记