如何使用 JWT 将密钥从前端(角度 4)传递到后端(节点 js)

Question

我正在学习Web应用程序，刚刚开始使用jwt身份验证。

我了解一般流程。后端如何创建 jwt 令牌以及前端如何检索每个后续请求中传递的令牌。

但是在每个在线教程或YouTube教程视频中都提到我们需要一个签名来创建包含只有客户端知道的密钥的令牌。但是在所有前端教程中，他们都在发送未显示密钥使用的持有者令牌。

有人可以告诉我如何将密钥与令牌一起传递到服务器吗？

Answer 1

okey 让我们首先了解 JWT 身份验证的过程 首先，一旦用户首次登录，就会在后端生成密钥 后端服务器检查用户是否存在，并在登录请求的响应中，服务器使用秘密词和与用户相关的唯一信息对令牌进行编码 通常是用户 ID 和时间验证令牌何时过期

const payload = {
sub: user.id,
exp: moment().add(EXPIRATION_DAYS_NUMBER, CONSTANTS.TIME_UNITY).unix()
}
let token = jwt.encode(payload, CONSTANTS.JWT_SECRET)

令牌被编码后，服务器在登录请求的响应中发送它，客户端抓取此令牌并将其存储在本地存储中，客户端现在应使用令牌与服务器进行任何将来的通信，该通信需要在每个需要身份验证的HTTP调用中进行身份验证，我们将令牌发送到标头中，以便服务器将检查Middelware中的标头并解码令牌女巫知道它是否是有效令牌的相同JWT_SECRT

middelware(req,res,next)
let token = req.headers.authorization
let payload = jwt.decode(token, CONSTANTS.JWT_SECRET)
user.findOne({ id: payload.sub }).exec((err, user) => {
if (err) return res.forbidden('not authorized')
next()
})

在客户端，我们可以使用角度拦截器在标头中设置令牌，以便与服务器进行所有通信

import { Injectable } from '@angular/core';
import {
HttpRequest,
HttpHandler,
HttpEvent,
HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
@Injectable()
export class TokenInterceptor implements HttpInterceptor {
constructor( {}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
request = request.clone({
setHeaders: {
Authorization: `Bearer localstorage.getItem(token)}`
}
});
return next.handle(request);
}
}

并将拦截器作为提供程序注入到应用程序模块中