在客户端使用HistoryLocation反应路由器应用程序

时间:2015-07-25 02:21:16

标签: reactjs html5-history react-router

我正在使用react路由器设置一个纯粹的客户端反应应用程序。应用程序需要是静态的而不是在服务器上运行,因为我必须在S3中托管它。

在我的Router.run我试图使用HistoryLocation,但它似乎不起作用。在客户端是不可能只有路由,所以我需要使用HashLocation?

Router.run(routes, Router.HistoryLocation, function (Handler) {  
  React.render(<Handler/>, document.getElementById('app'));
});

查看HistoryLocation的反应路由器文档:

使用HTML5历史记录API创建真实的网址。我们建议您使用此位置。它具有更好看的URL,是在浏览器中选择服务器呈现的应用程序所必需的。

您必须将服务器配置为使用HistoryLocation

1 个答案:

答案 0 :(得分:3)

要支持HistoryLocation,您将无法直接在S3 html资源上指向请求。您需要将资源放在app服务器(node.js,rails)或Web服务器之后,例如: nginx或apache,设置为在您希望在客户端支持的任何路由上返回静态页面。

您引用的文档提供了表达的示例:http://rackt.github.io/react-router/#configuring-your-server

这是一篇提供更多信息的文章:http://www.staticapps.org/articles/routing-urls-in-static-apps