nginx try_files的使用及理解

本文介绍如何使用Nginx的try_files指令解决单页面应用如Vue.js中刷新页面出现404的问题。通过正确配置,即使在刷新页面时也能正确加载index.html,保持路由路径不变。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

语法: try_files file ... uri 或 try_files file ... = code

默认值: 无

作用域: server location

主要按参数顺序检查文件是否存在,返回第一个找到的文件,文件:$uri 文件夹 :$uri/

最后一个参数,用来回退URI且必须存在,否则将会出现内部500错误。

一般最后一个参数使用@fallback进行重定向指定代理或文件

---------------

关于单页面,刷新404问题,如vue + nginx的配置, vue路由必须先加载 index.html 或者XX.js 才能识别到路由,故直接刷新页面会出现404,这时候最好到做法,是使用try_files 进行尝试,如果获取不到资源,加载index.html 再利用 rewrite的 last参数,保持路由路径不变,从而实现刷新页面。

但需要注意:此种解决方法需要 vue和nginx部署在同一台服务器上,这样try_files才能在服务器硬盘上找到index.html文件。

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值