2FA验证

icon2024年9月26日
icon132

前几天后端老大哥再让我开发登陆时候提到了2FA验证，于是我就去了解了一下，发现这个确实挺好用的。想着就记录下来!

友情提示:后端使用node

首先咱们需要使用了两个库 speakeasy 和 QRCode 一个是用于用于生成和验证 TOTP（基于时间的一次性密码）和 HOTP（基于计数的一次性密码）一个用户生成二维码。

TOTP是一种算法，他不需要网络支持，他根据密钥和当前的时间生成验证码（之前一直不懂app的验证码和后端怎么同步code）

实现2FA验证很简单，就是生成密钥-把密钥给用户，同时把生成的二维码也给用户-用户绑定，其实就这样，不过绑定后可以让用户输入一次code后端去处理（比如把是否绑定字段更改一下值）

生成2FA，首先创建 secret 变量用于保存这个库生成的，他返回的数据是一个对象里面有好几个参数。其中有一个base32是咱们要保存在用户的信息里面的，这个相当于是一个密钥。

  const secret = speakeasy.generateSecret({
    name: xxxxxxx,
    length: 20
  })

现在要生成二维码,注意toDataURL中传的第一个参数secret.otpauth_url就是上面生成的，这时候前端显示这个二维码，用户使用手机扫码就行了，这里要使用Authenticator 软件扫码，推荐谷歌的或者微软的，其他类似也可以不过有的收费（收费的就是垃圾！！！）

    QRCode.toDataURL(secret.otpauth_url, function (err, imageUrl) {
      if (err) {

          //二维码生成失败


      } else {

        //二维码获取成功

      }
    })

生成说完了，来说说验证。

其中userSecret就是上面咱们保存在用户信息中的base32（用户在获取用户信息时候，接口返回应该把保存这个数据的字段过滤，这个是密钥，属于敏感数据）然后就是code，这个就是用户输入的在app看到的验证码。

window:1 这个是容忍时间窗口，允许 30 秒时间误差，然后就是判断 isVerified 执行验证成功或者失败的代码。

        // 验证用户输入的动态验证码
        const isVerified = speakeasy.totp.verify({
          secret: userSecret,
          encoding: 'base32',
          token: code,
          window: 1
        })

其实这个这个就是生成验证，但是前端怎么实现，验证，绑定，取消绑定，绑定之后要不要输入一次密码，都可以去根据这个实现了。

这次就不放出完整代码，因为是编辑写的是接口，有很多没有的东西修改起来比较麻烦也不可以开箱即用~

最后可以去这里体验一下  小贺的代码站  。

🌺🌹完结撒花

热门文章