我正在使用React-router，当我点击链接按钮时，它工作得很好，但当我刷新我的网页时，它没有加载我想要的东西。
例如，我在localhost/joblist和一切都很好，因为我到达这里按下一个链接。但如果我刷新网页，我会得到:
Cannot GET /joblist
默认情况下，它不是这样工作的。最初我有我的URL localhost/#/和localhost/#/joblist，他们工作得很好。但我不喜欢这种类型的URL，所以试图删除#，我写道:
Router.run(routes, Router.HistoryLocation, function (Handler) {
React.render(<Handler/>, document.body);
});
这个问题不会发生在localhost/，这个总是返回我想要的。
这个应用程序是单页的，所以/joblist不需要向任何服务器询问任何事情。
我的整个路由器。
var routes = (
<Route name="app" path="/" handler={App}>
<Route name="joblist" path="/joblist" handler={JobList}/>
<DefaultRoute handler={Dashboard}/>
<NotFoundRoute handler={NotFound}/>
</Route>
);
Router.run(routes, Router.HistoryLocation, function (Handler) {
React.render(<Handler/>, document.body);
});
我还没有使用服务器端渲染，但我遇到了与OP相同的问题，其中Link在大多数时候似乎工作正常，但当我有一个参数时就失败了。我将在这里记录我的解决方案，看看它是否对任何人都有帮助。
我的主要JSX内容包括:
<Route onEnter={requireLogin} path="detail/:id" component={ModelDetail} />
这对于第一个匹配的链接很有效，但是当嵌套在该模型的详细页面上的< link >表达式中的:id发生变化时，浏览器栏中的URL会发生变化，但页面的内容最初并没有改变以反映链接的模型。
问题是我已经使用props.params.id在componentDidMount中设置了模型。组件只挂载一次，因此这意味着第一个模型是粘贴在页面上的模型，随后的链接更改了道具，但保持页面看起来不变。
在componentDidMount和componentWillReceiveProps的组件状态中设置模型(其中它基于下一个道具)可以解决问题，并且页面内容更改以反映所需的模型。
这里有一个简单、清晰和更好的解决方案。如果你使用网络服务器，它就可以工作。
每个web服务器都有能力在出现HTTP 404时将用户重定向到错误页面。要解决此问题，需要将用户重定向到索引页。
如果您使用Java基础服务器(Tomcat或任何Java应用程序服务器)，解决方案可能如下:
web . xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1">
<!-- WELCOME FILE LIST -->
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
<!-- ERROR PAGES DEFINITION -->
<error-page>
<error-code>404</error-code>
<location>/index.jsp</location>
</error-page>
</web-app>
例子:
得到http://example.com/about
web服务器抛出HTTP 404，因为此页面在服务器端不存在
错误页面配置通知服务器将index.jsp页面发送回用户
那么JavaScript将在客户端完成剩下的工作，因为客户端的URL仍然是http://example.com/about。
就是这样。不再需要魔法:)
因为我使用ASP。NET Core，类似这样的东西帮助了我:
public class HomeController : Controller
{
public IActionResult Index()
{
var url = Request.Path + Request.QueryString;
return App(url);
}
[Route("App")]
public IActionResult App(string url)
{
return View("/wwwroot/app/build/index.html");
}
}
基本上是在ASP上。NET MVC端，所有不匹配的路由都将落在startup.cs中指定的Home/Index中。在索引中，可以获取原始请求URL并将其传递到任何需要的地方。
文件startup.cs
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
routes.MapSpaFallbackRoute(
name: "spa-fallback",
defaults: new { controller = "Home", action = "Index" });
});
