使用react-router并通过Passport.js进行身份validation – 可能吗？

所以我正在开发一个包含React，Express.js + Passport和Webpack的项目。 我理解通过react-router将所有内容推送到“主”React组件的概念，然后让它散列出给定路线显示的内容。 我想这在这里会很好。 首先，我是React新手。

我的顾虑是：

1）我可以/我怎样才能使用护照来validation我的路线？ 如果我正确理解react-router，我将在我的express app.js文件中有一条path，指向名为<Application/>的React组件。 但是，护照需要router.get('/myroute', isAuthenticated, callback)来检查会话。 反应路由器是否仍然可以这样做？

2）此外，如果可能的话，我如何将Express中的path的值传递给我的视图，在React中？ 我知道在一个典型的观点，我可以使用<%= user %>或{{user}}如果我从我的路线传递。 这可能吗？

Answer 1

从APIpath中拆分视图渲染path。 毕竟你可以设置validation逻辑到API调用。

 //Auth check middleware function isAuth(req, res, next) {...} //API routes app.post("api/users/login", function() {...}); app.post("api/users/logout", function() {...}); app.get("api/purchases", isAuth, function() {...}); //and so on... //Wild card view render route app.use(function(req, res) { var router = Router.create({ onAbort: function(options) {...}, onError: function(error) {...}, routes: //your react routes location: req.url }); router.run(function(Handler) { res.set("Content-Type", "text/html"); res.send(React.renderToString(<Handler/>)); }); }); 

所以你必须解决你如何将视图中的服务器端渲染数据传递到客户端（select你的同构数据传输技术）。

您也可以只在客户端创build视图和redirect逻辑，并首先将组件处于“等待”状态，在组件将被挂载（通过API调用检查身份validation状态）后，将在客户端上parsing这些状态。