node.js - NodeJS 中的本地身份验证将 JWT 令牌快速传递回单独的 Angular SPA 客户端
问题描述
我正在使用 NodeJS 12 Express 4 中的后端和 Angular 8 中的前端客户端 SPA 构建应用程序。我正在使用 PassportJS 本地身份验证策略构建本地身份验证。
身份验证工作流程:
将 GET 请求发送到 /login 端点并加载登录页面。
注意:登录页面不在 SPA 中,它是一个简单的 pug 页面,其表单将 POST 发送到 /login 端点。
获取/登录
router.get('/', (req, res, next) => {
return res.render('login');
});
用户输入他们的凭据,提交表单并向 /login 发送 POST 请求。Passport 本地策略检查凭据,然后在回调中创建要发送回客户端的 JWT。
这就是我卡住的地方。如果我在 SPA 中有登录页面,我可以发送一个 AJAX 请求并将响应以 JSON 形式返回给客户端,例如return res.json(jwtToken)
,SPA 可以解析令牌并将其直接存储在会话存储中。
但是,由于登录页面直接在服务器上,如何将令牌发送回客户端?
目前,我正在尝试将令牌放在 auth 标头中并“重定向”到客户端 URL。这是有效的(我可以在浏览器控制台中看到身份验证令牌)但是 SPA 如何在 Angular 端读取令牌?Angular 需要访问 HTTP 标头,获取令牌并将其保存在会话存储中。
发布/登录
router.post('/', (req, res, next) => {
// Passport authentication strategy
passport.authenticate('local', function (err, user, info) {
// Callback after authentication strategy is complete
// Check error
if (err) {
console.error(err);
return res.status(404).json(err);
}
// Check if user was returned
if (user) {
// Generate JWT token
let jwt;
jwtToken = generateJwt();
// Set authorization header
res.set({
'Content-Type': 'application/json',
'Authorization': `Bearer: ${jwtToken}`,
});
// Redirect to the client
return res.redirect('http://localhost:4200/login');
//return res.json(jwtToken);
}
})(req, res);
});
问题:
在 Angular 组件中,是否可以解析 Authorization 标头以获取服务器发送的令牌?我尝试使用该activatedRoute
模块,但无法从初始页面加载中访问标题数据。我还尝试将令牌作为 URL 参数添加到 GET 请求中,但这会使 URL 变得非常长并以纯文本形式公开令牌。是否有任何合理的方法将令牌从服务器安全地发送到客户端?
更新:
我将尝试使用 express cookieParser 在 cookie 中发送令牌,类似于另一篇文章中的这个答案。这样,SPA 可以访问保存在 cookie 中的令牌,对其进行解析,然后将其保存在会话存储中。但是,我对此犹豫不决,并且不确定这是否是最可持续的技术,因为这需要一个额外的模块来解析 SPA 中的 cookie。
let options = {
maxAge: 1000 * 60 * 15,
httpOnly: false,
signed: true
}
// Set cookie
res.cookie('jwt-token', jwt, options)
// Redirect to the client
return res.redirect(302, 'http://localhost:4200/login');
解决方案
推荐阅读
- c - 在 Apache 服务器上放置带有摘要身份验证的 webdav 的 Curl c 示例
- python - 如何从手部图像中获取特征向量
- camera - 子类 QAbstractCameraController PyQt
- lisp - lisp中的字符串加法赋值
- ios - 使用 Swift 和 UITableview 禁用移动最后一行
- laravel - laravel中的mapWithKeys,我不明白它是如何工作的?
- powershell - Powershell - 删除-ADGroupMember
- docker - 将 docker 与 pbs pro 集成
- sql-server - 将拉取请求链接到 TFS 数据库中的工作项
- php - 自定义异常的默认参数