react路由问题

BrowserRouter会导致刷新找不到路径

服务器Nginx配置

采用Nginx方案需要先将所有资源打包生成到对应的目录,比如dist,然后做如下配置:

server{server_namereact.thinktxt.com;listen80;root/Users/txBoy/WEB-Project/React-Demo/dist;indexindex.html;location/{try_files$uri/index.html;}}

通过配置Nginx,访问任何URI都指向index.html,浏览器上的path,会自动被React-router处理,进行无刷新跳转。


Node服务端配置

一个express应用的配置示例:

constexpress=require('express');constpath=require('path');constport=process.env.PORT||8080;constapp=express();//加载指定目录静态资源app.use(express.static(__dirname+'/dist'))//配置任何请求都转到index.html,而index.html会根据React-Router规则去匹配任何一个routeapp.get('*',function(request,response){response.sendFile(path.resolve(__dirname,'dist','index.html'))})app.listen(port,function(){console.log("server started on port "+port)})

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容