如何在Node.js应用程序中的客户端站点上处理JWT令牌



我正在实现JWT令牌以进行身份验证。

我不使用任何客户端框架,例如Angular或React。只是EJS。

步骤1。我有一个API在成功的登录时返回令牌,如下图所示(我正在使用Postman进行测试API):

与JSON的API响应

步骤2。然后,我通过在邮递员中手动输入限制路线并沿着授权标头传递并沿授权标头传递,并且效果很好。

我的问题是从何处以及如何将返回令牌从客户端上的步骤1保存,以便在步骤2的标题中发送。

我是Web开发的新手,并遵循教程,但是我发现有关实施JWT令牌的所有教程都是为Angular编写的,或者在客户端站点上进行了反应。

任何帮助将不胜感激。

谢谢!

first 您必须使用jwt创建令牌

const token=jwt.sign({
                userId: user._id
                },config.secret, {expiresIn: '24h'});
                res.json({success:true,message:'Success', token:token, user: {username:user.username}});

然后在您的正面您可以将其保存到LocalStorage

这将生成一个唯一的密钥,您可以在标题中实现

之后,当您想检查标头中是否有JWT时,路线上的

router.use((req,res,next)=>{
        const token=req.headers['authorization'];
        if(!token){
            res.json({success:false, message:"No token provided"});
        }
        else{
            jwt.verify(token, config.secret, (err,decoded)=>{
                if(err){
                    res.json({success:false,message:"Token invalid: " + err});
                }
                else{
                    req.decoded=decoded;
                    next();
                }
            });
        }
    });

这是一个中间件,它将检查"授权"标题中是否有JWT密钥

请注意,此过程之后的每条路线都将运行此中间件。

在这里您将找到有关JSON Web令牌的所有详细信息

编辑

这是您可以处理Ajax请求的方法:

$("submit").click(function(){
    $.ajax({
       url : 'api/login,',
       type : 'POST',
       data : {login: $('#login').val(),password:$('#password').val()}
       dataType : 'JSON',
       success : function(data, statut){
           localStorage.setItem('token',data.token) // assuming you send a json token
       },
       error : function(resultat, statut, erreur){
         // whatever code you want
       },
       complete : function(resultat, statut){
       }
    });
});

具有一个对象存储令牌的对象,如果您想在用户离开后保留令牌,以便他将保持连接,只要令牌有效,您就可以将其保存在本地存储。

在客户端执行AJAX请求时,请从LocalStorage的对象中检索令牌,然后在授权标题中设置令牌。

最新更新