Nest.js 从零到壹系列(三):使用 JWT 实现单点登陆

前言

上一篇介绍了如何使用 Sequelize 链接 MySQL,接下来,在原来代码的基础上进行扩展,实现用户的注册和登陆功能。html

这里须要简单提一下两个概念 JWT 和 单点登陆:前端

JWT

JWT(JSON Web Token)是为了在网络应用环境间传递声明而执行的一种基于 JSON 的开放标准(RFC 7519)。该 Token 被设计为紧凑且安全的,特别适用于分布式站点的单点登陆(SSO)场景。JWT的声明通常被用来在身份提供者和服务提供者间传递被认证的用户身份信息,以便于从资源服务器获取资源,也能够增长一些额外的其它业务逻辑所必须的声明信息,该 Token 也可直接被用于认证,也可被加密。git

具体原理能够参考《JSON Web Token 入门教程 - 阮一峰》github

单点登陆

单点登陆(Single Sign On),简称为 SSO,是比较流行的企业业务整合的解决方案之一。SSO的定义是在多个应用系统中,用户只须要登陆一次就能够访问全部相互信任的应用系统。web

因此 JWT 实现【单点登陆】的大体流程是:sql

  1. 客户端用户进行登陆请求;
  2. 服务端拿到请求,根据参数查询用户表;
  3. 若匹配到用户,将用户信息进行签证,并颁发 Token;
  4. 客户端拿到 Token 后,存储至某一地方,在以后的请求中都带上 Token ;
  5. 服务端接收到带 Token 的请求后,直接根据签证进行校验,无需再查询用户信息;

下面,就开始咱们的实战:typescript

GitHub 项目地址,欢迎各位大佬 Star。数据库

1、编写加密的工具函数

src 目录下,新建文件夹 utils,里面将存放各类工具函数,而后新建 cryptogram.ts 文件:json

import * as crypto from 'crypto';

/**
 * Make salt
 */
export function makeSalt(): string {
  return crypto.randomBytes(3).toString('base64');
}

/**
 * Encrypt password
 * @param password 密码
 * @param salt 密码盐
 */
export function encryptPassword(password: string, salt: string): string {
  if (!password || !salt) {
    return '';
  }
  const tempSalt = Buffer.from(salt, 'base64');
  return (
    // 10000 表明迭代次数 16表明长度
    crypto.pbkdf2Sync(password, tempSalt, 10000, 16, 'sha1').toString('base64')
  );
}
复制代码

上面写了两个方法,一个是制做一个随机盐(salt),另外一个是根据盐来加密密码。数组

这两个函数将贯穿注册和登陆的功能。

2、用户注册

在写注册逻辑以前,咱们须要先修改一下上一篇写过的代码,即 user.service.ts 中的 findeOne() 方法:

// src/logical/user/user.service.ts
import { Injectable } from '@nestjs/common';
import * as Sequelize from 'sequelize'; // 引入 Sequelize 库
import sequelize from '../../database/sequelize'; // 引入 Sequelize 实例

@Injectable()
export class UserService {
  /** * 查询是否有该用户 * @param username 用户名 */
  async findOne(username: string): Promise<any | undefined> {
    const sql = ` SELECT user_id userId, account_name username, real_name realName, passwd password, passwd_salt salt, mobile, role FROM admin_user WHERE account_name = '${username}' `; // 一段平淡无奇的 SQL 查询语句
    try {
      const user = (await sequelize.query(sql, {
        type: Sequelize.QueryTypes.SELECT, // 查询方式
        raw: true, // 是否使用数组组装的方式展现结果
        logging: true, // 是否将 SQL 语句打印到控制台
      }))[0];
      // 若查不到用户,则 user === undefined
      return user;
    } catch (error) {
      console.error(error);
      return void 0;
    }
  }
}
复制代码

如今,findOne() 的功能更符合它的方法名了,查到了,就返回用户信息,查不到,就返回 undefined

接下来,咱们开始编写注册功能:

// src/logical/user/user.service.ts
import { Injectable } from '@nestjs/common';
import * as Sequelize from 'sequelize'; // 引入 Sequelize 库
import sequelize from '../../database/sequelize'; // 引入 Sequelize 实例

import { makeSalt, encryptPassword } from '../../utils/cryptogram'; // 引入加密函数

@Injectable()
export class UserService {
  /** * 查询是否有该用户 * @param username 用户名 */
  async findOne(username: string): Promise<any | undefined> {
    ...
  }

  /** * 注册 * @param requestBody 请求体 */
  async register(requestBody: any): Promise<any> {
    const { accountName, realName, password, repassword, mobile } = requestBody;
    if (password !== repassword) {
      return {
        code: 400,
        msg: '两次密码输入不一致',
      };
    }
    const user = await this.findOne(accountName);
    if (user) {
      return {
        code: 400,
        msg: '用户已存在',
      };
    }
    const salt = makeSalt(); // 制做密码盐
    const hashPwd = encryptPassword(password, salt);  // 加密密码
    const registerSQL = ` INSERT INTO admin_user (account_name, real_name, passwd, passwd_salt, mobile, user_status, role, create_by) VALUES ('${accountName}', '${realName}', '${hashPwd}', '${salt}', '${mobile}', 1, 3, 0) `;
    try {
      await sequelize.query(registerSQL, { logging: false });
      return {
        code: 200,
        msg: 'Success',
      };
    } catch (error) {
      return {
        code: 503,
        msg: `Service error: ${error}`,
      };
    }
  }
}
复制代码

编写好后,在 user.controller.ts 中添加路由

// src/logical/user/user.controller.ts
import { Controller, Post, Body } from '@nestjs/common';
import { UserService } from './user.service';

@Controller('user')
export class UserController {
  constructor(private readonly usersService: UserService) {}

  // @Post('find-one')
  // findOne(@Body() body: any) {
  // return this.usersService.findOne(body.username);
  // }

  @Post('register')
  async register(@Body() body: any) {
    return await this.usersService.register(body);
  }
}
复制代码

如今,咱们使用 Postman 来测试一下,先故意输入不同的密码和已存在的用户名:

如图,密码不一致的校验触发了。

而后,咱们把密码改为一致的:

如图,已有用户的校验触发了。

而后,咱们再输入正确的参数:

咱们再去数据库看一下:

发现已经将信息插入表中了,并且密码也是加密后的,至此,注册功能已基本完成。

3、JWT 的配置与验证

为了更直观的感觉处理顺序,我在代码中加入了步骤打印

1. 安装依赖包

$ yarn add passport passport-jwt passport-local @nestjs/passport @nestjs/jwt -S
复制代码

2. 建立 Auth 模块

$ nest g service auth logical
$ nest g module auth logical
复制代码

3. 新建一个存储常量的文件

auth 文件夹下新增一个 constants.ts,用于存储各类用到的常量:

// src/logical/auth/constats.ts
export const jwtConstants = {
  secret: 'shinobi' // 秘钥
};
复制代码

4. 编写 JWT 策略

auth 文件夹下新增一个 jwt.strategy.ts,用于编写 JWT 的验证策略:

// src/logical/auth/jwt.strategy.ts
import { ExtractJwt, Strategy } from 'passport-jwt';
import { PassportStrategy } from '@nestjs/passport';
import { Injectable } from '@nestjs/common';
import { jwtConstants } from './constants';

@Injectable()
export class JwtStrategy extends PassportStrategy(Strategy) {
  constructor() {
    super({
      jwtFromRequest: ExtractJwt.fromAuthHeaderAsBearerToken(),
      ignoreExpiration: false,
      secretOrKey: jwtConstants.secret,
    });
  }
  
  // JWT验证 - Step 4: 被守卫调用
  async validate(payload: any) {
    console.log(`JWT验证 - Step 4: 被守卫调用`);
    return { userId: payload.sub, username: payload.username, realName: payload.realName, role: payload.role };
  }
}
复制代码

5. 编写 auth.service.ts 的验证逻辑

// src/logical/auth/auth.service.ts
import { Injectable } from '@nestjs/common';
import { UserService } from '../user/user.service';
import { JwtService } from '@nestjs/jwt';
import { encryptPassword } from '../../utils/cryptogram';

@Injectable()
export class AuthService {
  constructor(private readonly usersService: UserService, private readonly jwtService: JwtService) {}

  // JWT验证 - Step 2: 校验用户信息
  async validateUser(username: string, password: string): Promise<any> {
    console.log('JWT验证 - Step 2: 校验用户信息');
    const user = await this.usersService.findOne(username);
    if (user) {
      const hashedPassword = user.password;
      const salt = user.salt;
      // 经过密码盐,加密传参,再与数据库里的比较,判断是否相等
      const hashPassword = encryptPassword(password, salt);
      if (hashedPassword === hashPassword) {
        // 密码正确
        return {
          code: 1,
          user,
        };
      } else {
        // 密码错误
        return {
          code: 2,
          user: null,
        };
      }
    }
    // 查无此人
    return {
      code: 3,
      user: null,
    };
  }

  // JWT验证 - Step 3: 处理 jwt 签证
  async certificate(user: any) {
    const payload = { username: user.username, sub: user.userId, realName: user.realName, role: user.role };
    console.log('JWT验证 - Step 3: 处理 jwt 签证');
    try {
      const token = this.jwtService.sign(payload);
      return {
        code: 200,
        data: {
          token,
        },
        msg: `登陆成功`,
      };
    } catch (error) {
      return {
        code: 600,
        msg: `帐号或密码错误`,
      };
    }
  }
}
复制代码

此时保存文件,控制台会报错:

能够先无论,这是由于尚未把 JwtService 和 UserService 关联到 auth.module.ts 中。

5. 编写本地策略

这一步非必须,根据项目的需求来决定是否须要本地策略

// src/logical/auth/local.strategy.ts
import { Strategy } from 'passport-local';
import { PassportStrategy } from '@nestjs/passport';
import { Injectable, UnauthorizedException } from '@nestjs/common';
import { AuthService } from './auth.service';

@Injectable()
export class LocalStrategy extends PassportStrategy(Strategy) {
  constructor(private readonly authService: AuthService) {
    super();
  }

  async validate(username: string, password: string): Promise<any> {
    const user = await this.authService.validateUser(username, password);
    if (!user) {
      throw new UnauthorizedException();
    }
    return user;
  }
}
复制代码

6. 关联 Module

// src/logical/auth/auth.module.ts
import { Module } from '@nestjs/common';
import { AuthService } from './auth.service';
import { LocalStrategy } from './local.strategy';
import { JwtStrategy } from './jwt.strategy';
import { UserModule } from '../user/user.module';
import { PassportModule } from '@nestjs/passport';
import { JwtModule } from '@nestjs/jwt';
import { jwtConstants } from './constants';

@Module({
  imports: [
    PassportModule.register({ defaultStrategy: 'jwt' }),
    JwtModule.register({
      secret: jwtConstants.secret,
      signOptions: { expiresIn: '8h' }, // token 过时时效
    }),
    UserModule,
  ],
  providers: [AuthService, LocalStrategy, JwtStrategy],
  exports: [AuthService],
})
export class AuthModule {}
复制代码

此时保存文件,若还有上文的报错,则须要去 app.module.ts,将 AuthServiceproviders 数组中移除,并在 imports 数组中添加 AuthModule 便可:

// src/app.module.ts
import { Module } from '@nestjs/common';
import { AppController } from './app.controller';
import { AppService } from './app.service';
import { UserModule } from './logical/user/user.module';
// import { AuthService } from './logical/auth/auth.service';
import { AuthModule } from './logical/auth/auth.module';

@Module({
  imports: [UserModule, AuthModule],
  controllers: [AppController],
  providers: [AppService],
})
export class AppModule {}
复制代码

7. 编写 login 路由

此时,回归到 user.controller.ts,咱们将组装好的 JWT 相关文件引入,并根据验证码来判断用户状态:

// src/logical/user/user.controller.ts
import { Controller, Post, Body } from '@nestjs/common';
import { AuthService } from '../auth/auth.service';
import { UserService } from './user.service';

@Controller('user')
export class UserController {
  constructor(private readonly authService: AuthService, private readonly usersService: UserService) {}

  // JWT验证 - Step 1: 用户请求登陆
  @Post('login')
  async login(@Body() loginParmas: any) {
    console.log('JWT验证 - Step 1: 用户请求登陆');
    const authResult = await this.authService.validateUser(loginParmas.username, loginParmas.password);
    switch (authResult.code) {
      case 1:
        return this.authService.certificate(authResult.user);
      case 2:
        return {
          code: 600,
          msg: `帐号或密码不正确`,
        };
      default:
        return {
          code: 600,
          msg: `查无此人`,
        };
    }
  }

  @Post('register')
  async register(@Body() body: any) {
    return await this.usersService.register(body);
  }
}
复制代码

此时保存文件,一样的报错又出现了:

此次咱们先去 user.module.tscontrollers 注释掉:

此时看控制台,没有 User 相关的路由,咱们须要去 app.module.ts 将 Controller 添加回去:

这么作是由于若是在 user.module.ts 中引入 AuthService 的话,就还要将其余的策略又引入一次,我的以为很麻烦,就干脆直接用 app 来统一管理了。

4、登陆验证

前面列了一大堆代码,是时候检验效果了,咱们就按照原来注册的信息,进行登陆请求:

图中能够看到,已经返回了一长串 token 了,并且控制台也打印了登陆的步骤和用户信息。前端拿到这个 token,就能够请求其余有守卫的接口了。

接下来咱们试试输错帐号或密码的状况:

5、守卫

既然发放了 Token,就要能验证 Token,所以就要用到 Guard(守卫)了。

咱们拿以前的注册接口测试一下,修改 user.controller.ts 的代码,引入 UseGuardsAuthGuard,并在路由上添加 @UseGuards(AuthGuard('jwt'))

// src/logical/user/user.controller.ts
import { Controller, Post, Body, UseGuards } from '@nestjs/common';
import { AuthGuard } from '@nestjs/passport';
import { AuthService } from '../auth/auth.service';
import { UserService } from './user.service';

@Controller('user')
export class UserController {
  constructor(private readonly authService: AuthService, private readonly usersService: UserService) {}

  @Post('login')
  async login(@Body() loginParmas: any) {
    ...
  }

  @UseGuards(AuthGuard('jwt')) // 使用 'JWT' 进行验证
  @Post('register')
  async register(@Body() body: any) {
    return await this.usersService.register(body);
  }
}
复制代码

而后,咱们先来试试请求头没有带 token 的状况:

能够看到,返回 401 状态码,Unauthorized 表示未受权,也就是判断你没有登陆。

如今,咱们试试带 Token 的状况,把登陆拿到的 Token 复制到 Postman 的 Authorzation 里(选择 Bearer Token):

而后再请求接口:

此时,已经能够正常访问了,再看看控制台打印的信息,步骤也正如代码中注释的那样:

至此,单点登陆功能已基本完成。

总结

本篇介绍了如何使用 JWT 对用户登陆进行 Token 签发,并在接受到含 Token 请求的时候,如何验证用户信息,从而实现了单点登陆。

固然,实现单点登陆并不局限于 JWT,还有不少方法,有兴趣的读者能够本身查阅。

这里也说一下 JWT 的缺点,主要是没法在使用同一帐号登陆的状况下,后登陆的,挤掉先登陆的,也就是让先前的 Token 失效,从而保证信息安全(至少我是没查到相关解决方法,若是有大神解决过该问题,还请指点),只能使用一些其余黑科技挤掉 Token。

如今,注册、登陆功能都有了,接下来应该完善一个服务端应有的其余公共功能。

下一篇将介绍拦截器、异常处理以及日志的收集。

`

相关文章
相关标签/搜索