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

相关推荐
激情的学姐1 小时前
【大型网站技术实践】初级篇:借助Nginx搭建反向代理服务器
运维·nginx
格子软件2 小时前
2026年GEO贴牌代理:分布式多级分账状态机源码深度解构
java·vue.js·分布式·vue·geo
之歆2 小时前
Vue商品详情与放大镜组件
前端·javascript·vue.js
2501_943782354 小时前
【共创季稿事节】摇骰子:用 ArkTS 实现随机动画与交互反馈
运维·nginx·交互·harmonyos·鸿蒙·鸿蒙系统
四月天434 小时前
web安全-SSTI(服务器模板注入)
笔记·学习·web安全·网络安全
疯狂打码的少年5 小时前
【操作系统】虚拟存储管理(局部性原理、缺页中断)
笔记
NULL指向我5 小时前
TMS320F28379D笔记5:CAN通信多邮箱配置
笔记
aaaameliaaa7 小时前
进制练习题【找出只出现一次的数字、交换两个变量(不创建临时变量)、统计二进制中1的个数、打印整数二进制的奇数位和偶数位、求两个数二进制中不同位的个数】
c语言·数据结构·笔记·算法
RainCity8 小时前
Java Swing 自定义组件库分享(十三)
java·笔记·后端
奶油mm8 小时前
公司技术债堆积如山,我一人之力用 Vue3 偷换了整个前端架构
前端·vue.js