阅读 58

nodejs jwt express-jwt jsonwebtoken

安装express-jwt

npm install express-jwt
npm install jsonwebtoken
复制代码

配置jwt (index.js)

const jwt = require('express-jwt');
// app.use(jwt().unless());
// jwt() 用于解析token,并将 token 中保存的数据 赋值给 req.user
// unless() 完成身份认证
app.use(jwt({
  secret: 'sfsws23s', // 生成token时的 钥匙,必须统一
  algorithms: ['HS256'] // 必填,加密算法
}).unless({
  path: ['/api/login', '/api/reguser'] // 除了这两个接口,其他都需要认证
}));
复制代码

生成token(login.js)

 let token =
        "Bearer " +
        jwt.sign({ id: result[0].id }, "fdsggs", { expiresIn: "2h" });
复制代码

登录接口(login.js)

router.post("/login", function (req, res) {
  let { username, password } = req.body;
  password = md5(password);
  let sql = `select * from user where username='${username}' and password='${password}'`;
  db(sql, (err, result) => {
    if (err) throw err;
    // console.log(result);
    if (result.length > 0) {
      let token =
        "Bearer " +
        jwt.sign({ id: result[0].id }, "fdsggs", { expiresIn: "2h" });
      res.send({ status: 0, message: "登录成功", token });
    } else {
      res.send({ status: 1, message: "账号或密码错误" });
    }
  });
  // res.send("POST request to the homepage");
});
复制代码

vue前端路由守卫限制

// JWT 用户权限校验,判断 TOKEN 是否在 localStorage 当中
router.beforeEach(({name}, from, next) => {
  // 获取 JWT Token
  if (localStorage.getItem('token')) {
    // 如果用户在login页面
    if (name === 'login') {
      next('/');
    } else {
      next();
    }
  } else {
   router.push('/login')
  }
});
复制代码

vue组件内headers携带token方法 (一)

var that=this;
            //获取课程列表
            this.axios({
                method:'get',
                url:'http://localhost:3000/api/v1/courses',
                headers:{
                    authorization:'Bearer '+window.localStorage.getItem('token')
                }
            }).then(result=>{
               
                if(result.data.length>0){
                    that.courses=result.data;
                }
            })
复制代码

vue组件内headers携带token方法 (二)设置axios拦截器

每次向后端请求携带 头信息
在 src/main.js 当中加上以下代码:
// http request 拦截器可选
axios.interceptors.request.use(
  config => {
    if (localStorage.token) {  // 判断是否存在token,如果存在的话,则每个http header都加上token
      config.headers.Authorization = `Bearer ${localStorage.token}`;
    }
    return config;
  },
  err => {
    return Promise.reject(err);
  });

axios.interceptors.response.use(
  response => {
    return response;
  },
  error => {
    if (error.response.status === 401) {
     //输出授权失败错误信息
    } else {
     //输出其他错误信息
    }
    return Promise.reject(error);
  }
);
复制代码
文章分类
前端
文章标签