gpt4 book ai didi

javascript - 使用 react-router 并通过 Passport.js 进行身份验证 - 可能吗?

转载 作者:IT老高 更新时间:2023-10-28 22:03:12 24 4
gpt4 key购买 nike

所以我正在开发一个包含 React、Express.js+Passport 和 Webpack 的项目。我理解通过 react-router 将所有内容推送到“主”React 组件的概念,然后让它散列为给定路由显示的内容。我认为这在这里会很好用。坦率地说,我是 React 新手。

我的担忧是:

1) 我可以/如何仍然使用 Passport 来验证我的路线吗?如果我正确理解 react-router,我将在我的 express app.js 文件中有一个路由,指向一个名为 <Application/> 的 React 组件。 .但是, Passport 需要router.get('/myroute', isAuthenticated, callback)检查 session 。用 react-router 还可以吗?

2) 此外,如果可能的话,如何在 React 中将 Express 中的路由值传递到我的 View 中?我知道在典型的 View 中,我可以使用 <%= user %>{{user}}如果我从我的路线上通过了。这里可以吗?

最佳答案

从 API 路径中 Split View渲染路径。毕竟,您可以将身份验证逻辑设置为 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/>));
});
});

因此,您必须解决如何将 View 中的服务器端渲染数据传递到客户端(选择同构数据传输技术)。

您还可以仅在客户端创建 View 和重定向逻辑,并首先将 React 组件呈现为“等待”状态,该状态将在安装组件后在客户端上解决(通过 API 调用检查身份验证状态) .

关于javascript - 使用 react-router 并通过 Passport.js 进行身份验证 - 可能吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30806569/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com