首页 > 解决方案 > 令牌通过授权传递,但在认证后被删除,无法传递到受保护的路由。令牌似乎未定义

问题描述

我的登录控制器在提交页面之前检查验证

static async signin(req, res, next) {
    const { email, password } = req.body;

    const sql1 = `SELECT * FROM users WHERE email='${email}'`;
    // localStorage.setItem('item', 'mwafrika');
    db.query(sql1, (err, rows, fields) => {
      if (rows.length > 0) {
        const comparePass = bcryptjs.compareSync(password, rows[0].password);
        if (!comparePass) {
          res.send({ err: 'password not valid' });
        } else {
          const data = {
            id: rows[0].id,
            email: rows[0].email,
            password: rows[0].password,
          };

          jwt.sign(data, process.env.SECRET_KEY, { expiresIn: '1h' }, (err, token) => {
            // req.session.userSession = token;
            res.send({
              token,
            });
          });
        }
      } else {
        res.send({
          err: 'You are not registered, please signup to login',
        });
      }
    });
  }

我的产品控制器从数据库中获取数据

static async getAll(req, res) {
    const fromPage = '/api/v1/post';

    // CheckLog.connection(req.session.userSession, req, res, fromPage, goLoginPage,() => {});

    const sql3 = 'SELECT * FROM produits';
    db.query(sql3, (err, rows, fields) => {
      if (err) return res.send({ err });
      // res.send({
      //   data: rows,
      // });
      res.render('checkout', {
        data: rows,

      });
    });
  }

我的中间件在访问受保护的路由之前验证令牌

  import jwt from 'jsonwebtoken';
    import dotenv from 'dotenv';

    dotenv.config();

    class Token {
      static async authorizeAccess(req, res, next) {
        try {
          const token = req.headers.authorization;
          // req.session.token = token;
          console.log(`mwafrikkke ${token}`);

          if (!token) return res.status(400).send({ status: 'error', message: 'please login to get access to this route' });
          const decoded = await jwt.verify(token, process.env.SECRET_KEY);
          req.user = decoded;
          console.log(req.user);
          return next();
        } catch (error) {
          return res.status(400).send({ status: 'error', message: 'you are not Autorized' });
        }
      }
    }

    export default Token.authorizeAccess;

我的 Ajax 调用并将令牌保存到客户端的本地存储中

 const signupBtn = document.getElementById('login');
signupBtn.addEventListener('click', (e) => {
  e.preventDefault();

  const userEmail = document.getElementById('loginEmail').value;
  const userPassword = document.getElementById('loginPassword').value;

  $.ajax({
    url: '/api/v1/auth/signin',
    method: 'POST',
    contentType: 'application/x-www-form-urlencoded; charset=utf-8',
    data: {
      email: userEmail,
      password: userPassword,
      // token: localStorage.getItem('token'),
    },
    success(res) {
      // post details method
      localStorage.setItem('token', res.token);
      console.log(`jossss${localStorage.getItem('token')}`);
      // window.location.href = 'http://localhost:7000/api/v1/products';
      if (res.token !== undefined) {
        $.ajax({
          url: '/api/v1/products',
          method: 'GET',
          contentType: 'application/x-www-form-urlencoded; charset=utf-8',
          headers: {
            Authorization: localStorage.getItem('token'),
          },
          success(res1) {
            document.location = '../products';
          },
        });
      } else {
        document.location = '../auth/signin';
      }
    },
  });
});

提交表单时要使用的我的登录表单

<section id="form"><!--form-->
    <div class="container">
        <div class="row">
            <div class="col-sm-5 col-sm-offset-1">
                <div class="login-form"><!--login form-->
                    <h2>Login to your account</h2>
                    <form action="/api/v1/auth/signin" method="POST">
                        <input type="email" placeholder="Email Address" id="loginEmail" name="email" required />
                        <input type="password" placeholder="Password" id="loginPassword" name="password" required />
                        <span>
                            <input type="checkbox" class="checkbox">  
                            Keep me signed in
                        </span>
                        <button type="submit" id="login" class="btn btn-default">Login</button>
                    </form>
                </div><!--/login form-->
            </div>
        </div>
    </div>
</section><!--/form-->

这是显示令牌后删除的图像

在此处输入图像描述 在此处输入图像描述

这是我拒绝访问的图像

标签: node.jsajaxjwtlocal-storageejs

解决方案


由于您authozation通过中间件的以下代码在标头中获取令牌:const token = req.headers.authorization;

请在发出 jax 请求时这样做,就像这样:

headers: {
           authorization: localStorage.getItem('token'),
         },

PS:确保您在 ajax 请求中设置的标头与您在服务器上的中间件中使用的标头相同。

请让我知道它是否仍然存在。


推荐阅读