React刷新页面报错(404)

报错原因:

你在浏览器内可以由首页跳转到其他路由地址,是因为这是由前端自行渲染的,你在React Router定义了对应的路由,脚本并没有刷新网页访问后台,是JS动态更改了location。

当刷新时,首先是访问的后台地址,然后返回的页面内加载了React代码,最后在浏览器内执行;也就是说如果这个时候报404,是因为你后台并没有针对这个路由给出返回HTML内容,也谈不上执行React Router了。

对于单页应用来说,大部分请求都找不到实际的文件,这个时候就需要返回 index.html 文件,让 JavaScript 代码根据 URL 渲染对应的页面。

如果你期望所有的路由都由React Router来定义,那么无论任何路径都返回index.html就可以了

解决方案一:

如果要在服务器里修改配置,比如Nginx,配置try_flies指令:它的作用是:按顺序尝试匹配文件或者路径,直到找到一个存在的文件或者路径为止。

例如:try_files $uri $uri/ /index.html;

解决方案二:

服务端路由不同的服务器配置的方式不同,需要我们自己查找配置。

另外一种简单的解决方法,使用HashRouter,不要使用BrowserRouter,这样所有的请求都会定位到index.html这一个页面,服务器端也不需要任何配置了。

posted @   狗狗听话  阅读(198)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 百万级群聊的设计实践
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 全网最简单!3分钟用满血DeepSeek R1开发一款AI智能客服,零代码轻松接入微信、公众号、小程
· .NET 10 首个预览版发布,跨平台开发与性能全面提升
· 《HelloGitHub》第 107 期
点击右上角即可分享
微信分享提示