react单页面应用的Nginx配置问题

项目中多数使用react单页面开发，路由使用react-router的browser-router，这样页面访问路径看起来像是真实的，如http://xx.xxx.xxx/a/b。但当项目访问路径为多级时，直接输入地址或刷新会报404。这是因为服务器会将其当做真实的路径去请求页面，但实际这个页面是不存在的，所以会报404错误。解决方法是让其请求到项目入口页面，由js去处理路由加载响应模块。

假如项目为A，入口文件为A/view/index.html，访问地址如 http://test.x431.com/A/view/login。在Nginx加如下配置。

 location ~* view {

     rewrite (.+)/view/(.+)$  $/view/index.html break;

 }

参考文档：

http://nphard.me/2016/03/07/nginx-for-react/

http://www.cnblogs.com/feiyuanxing/p/4668818.html

巴特西

react单页面应用的Nginx配置问题

最新文章

热门文章