React Rounter 刷新页面404【BrowserRouter】

问题描述:react router 当跳转到其他页面后,再次刷新该页面,会出现页面404的问题。

原因:

browserHistory 模式下,URL 是指向真实 URL 的资源路径,当通过真实 URL 访问网站的时候(首页),这个时候可以正常加载我们的网站资源,而用户在非首页下手动刷新网页时,由于路径是指向服务器的真实路径,但该路径下并没有相关资源,用户访问的资源不存在,返回给用户的是 404 错误

解决方法:

在webpack.config.js文件内,配置devServer的historyApiFallback属性为true。

devServer: {
        historyApiFallback: true,
    },

原理就是在刷新浏览器的时候,重新将当前路径下请求的资源全部指向SPA的index.html

你可能感兴趣的:(react.js)