修改nginx设置办理react-router欣赏器刷新呈现404页面的问题

2023-08-28 5443阅读 0评论

项目利用react-router，做成single page application，进口地点/home/hard/Project/game/web-client/build/html/index.html，通过域名domain.com就能会见到这个进口。

问题是，利用了路由之后，如果uri为domain.com/games.html，通过可以通过欣赏器api跳转页面，可一旦刷新页面，就会报404。

我但愿的是路由到某个uri之后，纵然刷新页面，或直接在欣赏器中输入这个uri，一样可以直接路由到games.html的页面。

在论坛上提了问，几天了没人响应，也查不到相关的资料，所以说其实查不到的，也问不大白，还得靠本身摸索。

利用node的处事器http-server

我一开始没多想，觉得是nginx的问题，也许node的处事器天然支持这一点。换了，问题没有办理。

开始的nginx设置

这个导致404是很明明的，假如uri是domain.com/games.html，那么nginx会试图在/home/hard/Project/game/web-client/build/html/目次下找games.html,404是必定的。

nginx rewrite办理

新的设置

server "expression">{
     "variable">listen 80;
"line">    server_ "variable">name "variable">www.domain.com "variable">domain.com;
"line">    location ~* "variable">.js$ {
"line">        root "end-block">/home "end-block">/hard "end-block">/Project "end-block">/game "end-block">/web-client "end-block">/build "end-block">/js;
"line">    }
"line">    location / "expression">{
"variable">root "end-block">/home "end-block">/hard "end-block">/Project "end-block">/game "end-block">/web-client "end-block">/build "end-block">/html/;
"line">    }
"line">    location ~* html "expression">{
"variable">rewrite "variable">.* "end-block">/index.html break;
"line">        root "end-block">/home "end-block">/hard "end-block">/Project "end-block">/game "end-block">/web-client "end-block">/build "end-block">/html/;
"line">    }
}

增加了一个 location 用来设置uri里头有html的，我用html来标识是否是客户端页面。

通过rewrite .* /index.html break;把一切path重写为/index.html,break很重要,它使得url的匹配竣事，最终处事返回的文档其实是/home/hard/Project/game/web-client/build/html/index.html。

谁人break抉择了欣赏器里的url是稳定的，而http响应的文档其实就是index.html，，而欣赏器上的path，会自动的被react-router处理惩罚，举办无刷新的跳转，我们看到的功效就是path对应了谁人页面！

2、mac电脑访达无响应

3、Nginx的流式响应配置

4、「康哥日记」第56篇：开始预定域名，做一批网站出来

5、黑客们都想要的域名corp.com，被微软确认收购

免责声明

1、本网站属于个人的非赢利性网站，转载的文章遵循原作者的版权声明。
2、本网站转载文章仅为传播更多信息之目的，凡在本网站出现的信息，均仅供参考。本网站将尽力确保所
提供信息的准确性及可靠性，但不保证信息的正确性和完整性，且不对因信息的不正确或遗漏导致的任何
损失或损害承担责任。
3、任何透过本网站网页而链接及得到的资讯、产品及服务，本网站概不负责，亦不负任何法律责任。
4、本网站所刊发、转载的文章，其版权均归原作者所有，如其他媒体、网站或个人从本网下载使用，请在
转载有关文章时务必尊重该文章的著作权，保留本网注明的“稿件来源”，并白负版权等法律责任。

手机扫描二维码访问