我需要添加啥以及将 JWT 令牌发送到浏览器标头的位置？

Posted 2023-03-08

【中文标题】我需要添加啥以及将 JWT 令牌发送到浏览器标头的位置？

【英文标题】：What do i need to add and where to send the JWT token to the browser header?我需要添加什么以及将 JWT 令牌发送到浏览器标头的位置？

【发布时间】：2020-09-19 14:05:12

【问题描述】：

我是后端新手，我正在尝试创建身份验证和授权 API。该应用程序在 Postman 中运行良好，但我必须手动发送令牌。我想把它发送到标题。

这是我的 auth.js 中间件。

const jwt = require("jsonwebtoken");

module.exports = function(req, res, next) 

  const token = req.header("token");
  console.log(token)
  if (!token) return res.status(401).json(
    message: "Auth Error"
  );

  try 
    const decoded = jwt.verify(token, "randomString");
    req.user = decoded.user;
    next();
   catch (e) 
    console.error(e);
    res.status(500).send(
      message: "Invalid Token"
    );
  
;

这是我的认证 index.js 文件

// Filename : user.js

const express = require("express");
const 
  check,
  validationResult
 = require("express-validator");
const bcrypt = require("bcryptjs");
const jwt = require("jsonwebtoken");
const auth = require('../middleware/auth')
const router = express.Router();

const User = require("../model/User");


//Signup
router.get('/signup', (req, res) => 
  res.render("signup.pug")
)

router.post(
  "/signup", [
    check("username", "Please Enter a Valid Username").isLength(
      min: 5
    ),
    check("email", "Please enter a valid email").isEmail(),
    check("password", "Please enter a valid password").isLength(
      min: 7
    )
  ],
  async(req, res) => 
    const errors = validationResult(req);
    if (!errors.isEmpty()) 
      return res.status(400).json(
        errors: errors.array()
      );
    

    const username = req.body.username;
    const email = req.body.email;
    const password = req.body.password;
    try 
      let user = await User.findOne(
        email
      );
      if (user) 
        return res.status(400).json(
          msg: "User Already Exists"
        );
      

      user = new User(
        username,
        email,
        password
      );

      const salt = await bcrypt.genSalt(10);
      user.password = await bcrypt.hash(password, salt);

      await user.save();

      const payload = 
        user: 
          id: user.id
        
      ;

      jwt.sign(
        payload,
        "randomString", 
          expiresIn: 10000
        ,
        (err, token) => 
          if (err) throw err;
          res.status(200).json(
            token
          );
        
      );
     catch (err) 
      console.log(err.message);
      res.status(500).send("Error in Saving");
    
  
);


//Login

router.get('/login', (req, res) => 
  res.render("login.pug")
)

router.post(
  "/login", [
    check("email", "Please enter a valid email").isEmail(),
    check("password", "Please enter a valid password").isLength(
      min: 6
    )
  ],
  async(req, res) => 
    const errors = validationResult(req);

    if (!errors.isEmpty()) 
      return res.status(400).json(
        errors: errors.array()
      );
    

    const 
      email,
      password
     = req.body;
    try 
      let user = await User.findOne(
        email
      );
      if (!user)
        return res.status(400).json(
          message: "User Not Exist"
        );

      const isMatch = await bcrypt.compare(password, user.password);
      if (!isMatch)
        return res.status(400).json(
          message: "Incorrect Password !"
        );

      const payload = 
        user: 
          id: user.id
        
      ;

      jwt.sign(
        payload,
        "randomString", 
          expiresIn: 3600
        ,
        (err, token) => 
          if (err) throw err;
          res.status(200).json(
            token
          );
        
      );
     catch (e) 
      console.error(e);
      res.status(500).json(
        message: "Server Error"
      );
    
  
);



router.get("/me", auth, async(req, res) => 


  try 
    // request.user is getting fetched from Middleware after token authentication
    const user = await User.findById(req.user.id);
    res.json(user);
   catch (e) 
    res.send(
      message: "Error in Fetching user"
    );
  
);

module.exports = router;

还请说明将代码放在何处。提前谢谢！！！

【问题讨论】：

请您再解释一下您的问题。您是说通过邮递员中的标头发送令牌是您的问题吗？如果这是您的问题，您可以在邮递员中使用 Authorization 选项卡，link。

我想把API连接到前端。我只做了部分。令牌必须发送到浏览器的标头，但我无法这样做。

【参考方案1】：

令牌应该在登录响应的正文中发送，而不是在标头中。

var token = jwt.sign(
  payload,
  "randomString",
  
    expiresIn: 10000
  ,
  (err, token) => 
    if (err) throw err;
    res.status(200).json(
      token
    );
  
);

// This line should send the token to your client in the body
res.json( token );

您的客户端从您的后端接收响应并将其保存在本地（在内存、cookie 或本地存储中）并应将其用于后续请求。

当从您的客户端发出经过身份验证的请求时，您才应该将令牌添加到您的 Authorization 标头中。

【讨论】：

谢谢！我认为这就是问题所在。我没有以令牌作为参数来渲染路由。

【参考方案2】：

在签署令牌后插入。

res.render('/(Page Route)',token: token);