Javascript 通过路径直接访问或刷新页面时发生反应路由器错误

我已经实现了react router，没有任何问题，它工作正常，但由于某些原因，如果用户刷新页面或试图通过路径直接访问主页面的其他页面，我会收到一个错误，例如无法获取/无论什么（例如无法获取/博客）

代码如下：

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, browserHistory } from 'react-router';
import { Provider } from 'react-redux';
import store from 'store';

// Layouts
import App from 'layouts/app';

// Components
import Portfolio     from 'ui/portfolio';
import BlogContainer from 'ui/blog-container';
import TimeLine      from 'ui/timeline';
import About         from 'ui/about'
import Contact       from 'ui/contact'

ReactDOM.render((
  <Provider store={store}>
    <Router history={browserHistory}>

        <Route component={App}>
            <Route path="/" component={Portfolio} />
            <Route path="/blog" component={BlogContainer} />
            <Route path="/timeline" component={TimeLine} />
            <Route path="/about" component={About} />
            <Route path="/contact" component={Contact} />
        </Route>

    </Router>
  </Provider>
), document.getElementById('root'));

---

从路由中删除“/”。直接调用组件。 如： {

---

}

问题在于，您的服务器路由器（nginx、Apache…）不知道返回什么以及向浏览器发送什么内容。基本上，如果您的应用程序只是您已经捆绑的前端应用程序，并且承认您正在使用nginx，那么您的服务器需要这种配置：

server {

    location / {
        try_files $uri /your/index.html; # the path to your html page
    }
} 

然后，当您试图直接转到某个路由时，服务器将始终返回包含javascript包的html页面，

react router

将处理其余部分

---

查看

react router

的文档中的。您可以向我们显示

ReactDOM.render

之前的行吗？添加一个，同时从路由中删除“/”，根路径除外。您可以用

hashHistory

替换

browserHistory

并尝试

#/your route

URL，只是为了测试purposes@KeitIG我做了你所说的改变，它是有效的，但现在这条路看起来像，而不是像，有没有办法保持这条路干净？是的，这只是一个测试，以了解问题出在哪里，我会尝试发布一个答案，因为我做了你的改变，但不起作用。位置“/blog”与任何路由都不匹配，我使用“react router”中的{Link}生成链接。

<Route component={ App } path='/master'>
        <Route path = 'board' component={BoardView} />
        <Route  path = 'team'  component={View} />
        <Route path = 'all' component={All} />
        <Route path = 'shots' component={Shots} />
        <Route path = 'home' component={Home} />
        <Route path = 'topper' component={Toppers} />
        <Route path = 'overlay' component={Overlay} />
        <Route path = 'earn' component={Earn} />

server {

    location / {
        try_files $uri /your/index.html; # the path to your html page
    }
}