nginx代理后刷新显示404

BitPathfinder
• 阅读 10661

现象

通过首页进入访问页面正常,刷新之后出404页面

原因

原因是因为web单页面开发模式,只有一个index.html入口,其他路径是前端路由去跳转的,nginx没有对应这个路径,当然就是404了。

解决方案

location / {
    root   /usr/nginx/app/dist/;
    index  index.html;
    try_files  $uri $uri/ /index.html;
}

总结

在配置中加上try_files,意思跟翻译差不多,“尝试读取文件”。u r i 这 个 是 n g i n x 的 一 个 变 量 , 存 放 着 用 户 访 问 的 地 址 , 例 如 h t t p : / / l o c a l h o s t : 8200 / c h o o s e S i z e 那 么 uri 这个是nginx的一个变量,存放着用户访问的地址,例如http://localhost:8200/chooseSize 那么uri这个是nginx的一个变量,存放着用户访问的地址,例如http://localhost:8200/chooseSize那么uri就是/chooseSize;u r i / 代 表 访 问 的 是 一 个 目 录 例 如 h t t p : / / l o c a l h o s t : 8200 / c h o o s e S i z e / 那 么 uri/ 代表访问的是一个目录 例如http://localhost:8200/chooseSize/ 那么uri/代表访问的是一个目录例如http://localhost:8200/chooseSize/那么uri/就是/chooseSize/;最后/index.html就是我们首页的地址。
最终上面的意思是如果第一个存在,直接返回;不存在的话读取第二个,如果存在,读取返回;如果还是不存在,就会fall back到 try_files 的最后一个选项 /index.html,发起一个内部 “子请求”,也就是相当于 nginx 发起一个 HTTP 请求http://localhost:8200/index.html,再通过前端路由到/chooseSize

点赞
收藏
评论区
推荐文章
十月飞翔 十月飞翔
3年前
docker 启动nginx,指定映射目录,启动后nginx不退出
1.nginx退出问题:需要把/etc/nginx/nginx.conf里的user由nginx改成当前用户root。3.在/usr/share/nginx/html/index.html里保存了网页,有时候是空的,需要自己创建访问页面root@8afd7f43d8f0:/usr/share/nginx/htmlcat<index.html
芝士年糕 芝士年糕
3年前
Nginx 报404问题,如何解决
近日在使用服务器部署项目时,出现了一些问题,如图正常的登录界面是可以访问的,但是在登录之后访问之后的地址会报404错误,于是去查看是否配置有错误,但是查看之后发现,nginx.conf与config.js两个配置文件的ip和端口都是没有错误的这个项目部署过好多次,没有出现过这样的错误。这是原版没动过的解压缩后的nginx.conf的源文件圈起来的地方是应该按
Stella981 Stella981
4年前
Nginx 配置静态文件 404 问题
使用Nginx做访问静态资源的时候,配置之后访问一直是 404。我的配置是location/dist{      root/usr/local/nginx/html/dist;      }原因:root配置的意思是,会在root配置的目录后跟上URL,组成对应的文件路径。即我的访问h
Stella981 Stella981
4年前
DispatcherServlet错误的配置导致访问静态资源被拦截!
在SpringMVC的实验中发现,即使我的页面导入的资源路径是完全正确的,浏览器也报错Failedtoloadresource:theserverrespondedwithastatusof404(Notfound),而后台报NomappingfoundforHTTPrequestwithURI……的异常。!
Stella981 Stella981
4年前
PHP网站从Apache转移到Nginx后产生404错误的原因和解决办法
PHP网站从Apache转移到Nginx后产生404错误的原因和解决办法原案例分析:1、原来的网站在wamp环境下搭建完成,一切正常,上传到虚拟主机环境为lnmp,结果访问时可以打开主页,然后点其他页面全部报404错误; 2、经分析得出原因:原网站环境为wa
Stella981 Stella981
4年前
Nginx升级Keepalive_Requests默认值变更
T婶早上同步了一个消息, Nginx代理和Upstream服务器之间在某种情况下一直发connection:close。Nginx从1.13.6升级到了1.15.8出现的问题,T婶牺牲了午休的时间堵上的这个坑,其根本原因,是升级到1.15.8之后,Nginx的长链接Keepalive\_Requests的默认值变成了:100。 过个这个极值就
Stella981 Stella981
4年前
Nginx页面图片错误 ERR_CONTENT_LENGTH_MISMATCH
现场:nginx代理的网站有的虚拟目录的图片无法正常显示,提示 ERR\_CONTENT\_LENGTH\_MISMATCH,不断刷新页面图片一条一条的显示出来。解决方法:找到nginx的缓存文件目录,chown为www查看nginx相关进程发起者:!(https://oscimg.oschina.net/oscnet/ae47bc23a54
Wesley13 Wesley13
4年前
10分钟彻底搞懂单页面应用路由
上一次,跟大家科普了小程序的自定义路由routes,开启了路由之旅;今天,顺势就单页面应用路由,跟大家唠个五毛钱,如果唠得不好……退…一块钱?单页面应用特征假设:在一个web页面中,有1个按钮,点击可跳转到站内其他页面。多页面应用:点击按钮,会从新加载一个html资源,刷新整个页面;单页面应
Stella981 Stella981
4年前
Angular最新教程
Angular之所以被称为单页面应用,就是因为我们在改变浏览器URL的时候, 不触发刷新当前页面的行为,我们看到的所有的界面,其实是在一个主URL中。 这个功能(功能?现象?表现?随便吧!)就是通过路由实现的。 下面我们先简单的看一个关于路由的例子。!(https://oscimg.oschina.net/oscnet/4e0e1
十月飞翔 十月飞翔
3年前
docker 启动nginx,指定映射目录,启动后nginx不退出
1.nginx退出问题:需要把/etc/nginx/nginx.conf里的user由nginx改成当前用户root。3.在/usr/share/nginx/html/index.html里保存了网页,有时候是空的,需要自己创建访问页面root@8afd7f43d8f0:/usr/share/nginx/htmlcat<index.html
鸿蒙小林 鸿蒙小林
8个月前
《仿盒马》app开发技术分享-- 订单详情页(32)
技术栈Appgalleryconnect开发准备在之前的章节中我们实现了订单的提交,以及提交之后跳转到确认订单页面,在确认订单页面我们添加了一个入口,这个入口是查询订单,当我们点击入口时,我们需要跳转到一个新的界面,这个界面通过接收上个界面的订单id或者订