JWT 鉴权

作者: ComfyUI | 来源:发表于2020-11-09 09:03 被阅读0次

使用 koa-jwt + jsonwebtoken 完成用户鉴权功能。
项目地址:https://github.com/Ewall1106/mall

安装

$ npm install koa-jwt jsonwebtoken --save
  • 先明确一下两者的关系:koa-jwt 是负责对 token 进行验证的,而 jsonwebtoken 是负责生成 token 的。

JWT 鉴权

  • app.js 中引入并使用。
const Koa = require('koa');
const jwt = require('koa-jwt');

const app = new Koa();

// 1. 错误信息处理
app.use(async (ctx, next) => {
  return next().catch((err) => {
    if (401 == err.status) {
      ctx.body = {
        code: 50001,
        message: '用户鉴权失败',
      };
    } else {
      throw err;
    }
  });
});

// 2. 中间件注册
app.use(jwt({ secret: JWT_SECRET }).unless({ path: [/^\/public/, /\/login/] }));
  • 1 处是定义了当鉴权失败的时候,koa 服务返回的一些内容。

  • 2 处就是 koa-jwt 这个中间件的注册。

    • 其中 JWT_SECRET 是一个加密因子,可以提升安全性,你也可以设置成123456,但是为了更安全点推荐用密钥生成器生成一段密钥。
    • 后面的 path 路径是设置匹配不需要鉴权的路由或目录,比如我这里设置了所有的 public 开头的、登录 xxxx/login 的请求都不需要鉴权。

Token 生成

  • 还是前面说到的,koa-jwt 是负责对 token 进行验证的,而 jsonwebtoken 是负责生成 token 的,所以接下来看我们如何进行 token 的生成。
// controller/UserController.js
const jwt = require('jsonwebtoken');

async login(ctx, next) {
  // ...
  // 在登录成功后
  const token = jwt.sign({ uid: user._id }, JWT_SECRET, { expiresIn: '15d' });
  ctx.body = {
    code: 200,
    entry: {
      token: token
    },
  };
},
  • 如上,利用 jsonwebtoken 这个库,其实 token 的生产很简单。

    • { uid: user._id } 就是一个 payload 数据载体,就是你可以放些参数在 token 中,比如用户的 id
    • JWT_SECRET 就是前面提到的加密因子,要跟 koa-jwt 设置的保持一致。
    • expiresIn 设置 token 的过期时间。
  • 至此,服务端的鉴权主要功能就完成了。

前端设置

  • 在前端,首先我们需要登录的时候获取这个 token,然后把它放到 vuex 中或者本地缓存起来。
// 登录
login(loginInfo).then((res) => {
  const { token } = res.entry;
  console.log('token', token);
});
  • axios 请求拦截器中设置 Authorization 鉴权头,每次请求的时候都带上 token 值。
// src/utils/request.js

// 请求拦截器
service.interceptors.request.use(
  (config) => {
    if (store.getters.token) {
      // JWT鉴权
      config.headers.Authorization = `Bearer ${getToken()}`;
    }
    return config;
  },
  (error) => {
    console.log(error);
    return Promise.reject(error);
  }
);
  • 然后服务端的 koa-jwt 就会通过读 Authorization 这个 header 头中的 token 值来进行比对校检鉴权了。

  • 至此,我们使用 koa-jwt + jsonwebtoken 完成了用户鉴权功能,具体代码实现请移步项目仓库中。

相关文章

  • JWT鉴权 Session鉴权

    JWT鉴权:image.png session鉴权:image.png

  • Koa 使用 JWT 实现鉴权

    JWT 鉴权的优势 JWT (JSON Web Token) 是现今比较主流的的登录鉴权方式。token 类似一个...

  • JWT 鉴权

    JWT 是什么 JSON Web Token(JWT)是一个开放式标准(RFC 7519),它定义了一种紧凑且自包...

  • JWT 鉴权

    使用 koa-jwt + jsonwebtoken 完成用户鉴权功能。项目地址:https://github.co...

  • jwt鉴权

    什么是JWT(Json web token): JWT是目前最流行的跨域认证解决方案。基于json的开放标准(R...

  • 前端鉴权和缓存相关收藏

    Auth2鉴权 JWT cookie-session 缓存相关

  • JWT

    概述 JWT 基于 token 的鉴权机制,基于 token 的鉴权机制类似于 http 协议也是无状态的,它不需...

  • 鉴权

    常见的鉴权方式:Session/Cookie、Token(JWT)、OAuth、SSO Session/Cooki...

  • PHP中怎样使用JWT进行鉴权验证?

    1.概述 JWT可以取代以往的基于 COOKIE/SESSION 的鉴权体系,是目前最热门跨域鉴权的解决方案,接下...

  • 四、SpringCloud鉴权之OAuth2.0(中篇)

    鉴权(中篇) SpringSecurity + OAuth2 + JWT 前言 上篇 文章我们完成了SpringS...

网友评论

    本文标题:JWT 鉴权

    本文链接:https://www.haomeiwen.com/subject/cfotbktx.html