vue+express搭建系统时利用token保持登陆状态

在我们登陆以后,我们通常希望以后的每次url请求都带上认证信息,即让我们的服务器知道我们已经登陆。利用jwt(jsonWebToken)插件可以帮我们生成相应tokten

const jwt = require('jsonwebtoken');
let expressJWT = require('express-jwt');//引入中间件对token进行验证

app.post('/login', function (req, res) {
  let content = {name:req.body.userName}; // 要生成token的主题信息
  let userName = req.body.userName;
  console.log(req.body)
  let password = req.body.password;
  let secretOrPrivateKey="jwt";// 这是加密的key(密钥)
  let token = jwt.sign(content, secretOrPrivateKey, {
      expiresIn: 60*60*1  // 1小时过期
  });
  users.findOne({ userName: userName,password: password }, function (err, user) {       
  //相关业务逻辑
})

通过res将token信息交给前端,前端在获取到token信息后将token信息保存在sessionStorage中,最好是sessionStorage较localStorage安全,然后在axios拦截器其中将每次的请求头中写上token即可

login (loginForm) {
      this.$refs[loginForm].validate(async (valid) => {
        if (valid) {
          const { data: res } = await this.$http.post('/login', this.loginForm)
          if (res.status === 200) {
            window.sessionStorage.setItem('token', res.token)
            this.$message('登陆成功')
            this.$router.push('/home')
          }
        } else {
          this.$message('请正确输入用户名与密码')
          return false
        }
      })
    }
axios.interceptors.request.use(
  config => {
    config.headers.Authorization = window.sessionStorage.getItem('token')
    return config
  })

 

你可能感兴趣的:(express,vue)