成功登录后如何在标题中添加JWT

时间:2018-07-01 15:42:15

标签: javascript rest api symfony authentication

我正在使用Symfony 4构建Web应用程序,并且试图将后端实现为REST API。

作为登录过程的一部分,我创建了一个端点,该端点在收到有效的用户名和密码后返回JWT。然后,我将JWT这样保存到浏览器的本地存储中:

$(document).ready(function() {

$('.js-login-form').submit(function (e) {
    e.preventDefault();

    let username = $('#_username').val();
    let password = $('#_password').val();
    let data = JSON.stringify({_username: username, _password: password});

    $.ajax({
        method: 'POST',
        url: '/api/tokens',
        contentType: "application/json",
        dataType: 'json',
        data: data,
        success: function(data) {
            localStorage.setItem('token', data.token);
            // Add Header to the request Authorization: "Bearer " . data.token
            window.location='/app';
        },
        error: function(jqXHR) {
            var errorData = JSON.parse(jqXHR.responseText);
            console.log(errorData);
        }
    });
});
});

我的问题是如何将JWT添加到标题中,以便将用户重定向到密码保护的区域。然后,我的警卫验证者将相应地验证令牌。

非常感谢

1 个答案:

答案 0 :(得分:0)

你的意思是在后端的头部添加 JWT 吗? 如果是,您可以创建中间件来检查用户是否经过身份验证。 这是示例:

// add jwt module
const jwt = require('jsonwebtoken');

async function isAuthValid(req,res,next) {
  try {
    // check header
    let token = req.headers['authorization'];
    if (token.startsWith('Bearer ')) {
      // check token type
      token = token.slice(7, token.length).trimLeft();
    } else {
      return res.send('wrong token type');
    }

    if (token) {
      // ? check token
      let verifiedUser = await jwt.verify(token, 'somesecret', (err, decoded) => {
        if (err) {
          return res.send(err.message);
        } else {
          return decoded
        }
      });
      req.authUser = verifiedUser
      next();
    }
  } catch (err) {
    return res.send('no token provided');
  }
}

module.exports = isAuthValid

在路由上注册为中间件

const express = require('express');
const isAuthValid = require('./checkAuthUser.js');

const app = express();

app.get('/myRoute', isAuthValid, (req,res) => {
  return res.send('protected endpoint')
});