本文将以时间维度介绍一些目前常见的Web验证方法以及相关协议，带你了解Web验证的过去、现在与未来。

传统身份验证方式

 

 

过去普遍的做法可能是这样的

注册

• 前端注册页面填写用户名和密码表单，发送给后台服务器
• 后台服务器将接收到的用户名和密码进行加密并插入到数据库，然后回馈是否成功的信息给前端页面。

登录

• 前端登录页面填写用户名和密码表单，发送给后台服务器
• 后台服务器将接收到的用户名和密码进行加密后与数据库储存信息进行对比，如果账号密码一致则返回给前端登录成功信息，不一致则返回失败信息。

这种做法存在普遍问题

• 当登录环境不安全时，输入密码时可能被监控
• 发送密码到服务器的过程中可能被劫持
• 密码存储在数据库如果被黑客攻击可能造成大量密码泄露

这种做法最大的问题在于你需要输入密码

• 人们通常使用一个密码应对所有账号，而攻击者获取密码的方式又数不胜数，一旦在某个疏于防备的瞬间泄露了一个密码，那么该用户所有账号都将面临巨大安全风险

第三方登录方式

 

 

现在，越来越多的站点开放了第三方登录的功能，使得账号密码登录不再是唯一的身份验证方式，在可以进行第三方登录的站点，人们通常选择使用第三方登录的方式进行身份验证。实现第三方登录有两种协议，分别为OpenID开放认证协议与OAuth开放授权协议

OpenID和OAuth完全是为了两种不同的需求而生，OpenID的目标是为了帮助网站确认一个用户的身份 ，OAuth的目标是为了授权第三方在可控范围下访问用户资源，OAuth有两个版本，OAuth1.0由于其实现较为复杂，已经基本被OAuth2.0所取代，以下分别对两种协议进行讲解

OpenID 开放认证协议

 

 

 

定义

• OpenID是一个去中心化的网上身份认证系统。对于支持OpenID的网站，用户不需要记住像用户名和密码这样的传统验证标记。取而代之的是，他们只需要预先在一个作为OpenID身份提供者（identity provider, IdP）的网站上注册，比如google。OpenID是去中心化的，任何网站都可以使用OpenID来作为用户登录的一种方式，任何网站也都可以作为OpenID身份提供者。OpenID既解决了问题而又不需要依赖于中心性的网站来确认数字身份。
• OpenID是专为登录认证而生，它使用简单，门槛很低。一个网站如果想要接入OpenID认证是非常简单的，不需要创建应用，不需要App Key，不需要Secret，只需要将用户导向OpenID Provider的Entry并带上Callback，用户只要同意提供信息，你就可以拿到这个用户的唯一标识。对于站点来说只要有人使用Google OpenID授权并返回这个唯一标识那就是我在登录。

优点

• 使用门槛变低，免去注册流程，且用户不再需要输入密码，可直接使用第三方登录，有利于产品的广泛传播
• 由于客户端不在需要输入密码，很大程度上减少了安全风险，客户端不接触用户密码，服务器端更易于集中保护

缺点

• 依赖开放平台的安全防护能力，因为开放平台本身也可能是使用账号密码登录或者其他第三方平台登录，所以开放平台本身也会出现一定的安全风险。如果开放平台本身出现安全问题，那么所有与其关联的第三方认证站点都将会出现安全问题
• 依赖开放平台的认证，如果开放平台的稳定性不达标，会导致自身登录稳定性差。如第三方平台暂时不可用，则自身登录也不可用，如果开放平台恶意不给予认证，那么用户将无法登录，这个在较大的站点上是致命的。
• 用户流失的风险，因为用户只记得是用第三方登录的，而往往不是该网站的帐号，弱化了自身账号的影响力。

OAuth2.0 开放授权协议

 

 

 

定义

• 提到OAuth，可以想像这样一幅画面，在一个炎热且忙碌的夏天，小明与妻子在公司不分昼夜的赶着项目，可家里又有老人需要照顾，所以小明决定请一个保姆照顾老人，但是又觉得如果保姆能在家里乱走的话很不放心，就授权给保姆一个只能打开老人房门且有效期仅为7天的临时密码凭证，之后一周内保姆拿着这个临时密码凭证便可以不经过小明同意随意出入老人房间，但不能进入小明和他妻子的房间。
• 我们把上面的例子搬到互联网，就是 OAuth 的设计了，OAuth与OpenID最大的区别就是，OpenID是一种认证协议，是开放平台给第三方一个能够代表用户身份的唯一标识，而OAuth是一种授权协议。授权允许第三方直接从开放平台读取用户信息。

优点

• 使用门槛变低，免去注册流程，且用户不再需要输入密码，可直接使用第三方登录，有利于产品的广泛传播
• 由于客户端不在需要输入密码，很大程度上减少了安全风险，客户端不接触用户密码，服务器端更易于集中保护
• 客户可以具有不同的信任级别，级别越高，可获取资料越多

缺点

• 依赖开放平台的安全防护能力，因为开放平台本身也可能是使用账号密码登录或者其他第三方平台登录，所以开放平台本身也会出现一定的安全风险。如果开放平台本身出现安全问题，那么所有与其关联的第三方认证站点都将会出现安全问题
• 依赖开放平台的授权，如果开放平台的稳定性不达标，会导致自身登录稳定性差。如开放平台暂时不可用，则自身登录也不可用，如果开放平台恶意不给予授权，那么用户将无法登录，这个在较大的站点上是致命的。
• 用户流失的风险，因为用户只记得是用第三方登录的，而往往不是该网站的帐号，弱化了自身账号的影响力。
• 站点获取到开放平台用户的临时权限后利用这些权限来做什么完全由该站点决定，在一定程度上会带来安全隐患。

第三方登录总结

第三方登录简化了注册登录流程，用户在使用时大部分情况下都不需要输入账号密码来进行登录操作，但第三方登录依赖开放平台，开放平台依然需要进行账号密码的储存与管理，而且当开放平台出现安全事故时，所有通过该平台登录的站点都将面临安全风险。

2FA 双因素认证

什么是双因素认证

• 双因素认证也叫二次验证就是指同时使用两种及以上能够证明自己身份的方式进行验证，双因素认证就是在使用用户名密码登录网站、应用、账号之后，还需要一个验证码才能正常登录。
• 其实双因素认证早在十几年前就已经开始应用，诸如短信验证码、邮件验证码、动态令牌、RSA电子动态令牌等都属于双因素认证。各大网银广泛使用的各种盾、各种 Key 其实也属于双因素认证，包括短信验证码，它能够让用户的数据多一层保护。

 

 

 

常见的双因素认证方法

• 第一种是短信验证，也是目前较为常用的，每一次认证时会生成短信验证码发送到指定手机上，输入的内容与发送的内容一致则完成认证。
• 第二种是认证APP，基于TOTP的加密算法，利用应用与认证APP共同持有的种子密钥，每隔30秒生成一个新的6位验证码，应用与APP之间的验证码一致则完成验证，通常在公司内部使用的VPN就是采用这种方式来进行身份验证。
• 第三种是登录确认的方式，这种方式不需要输入验证码，而是通过登录确认点击的方式来完成双因素认证的过程，这种方式是通过公钥加密算法来确认你的身份，应用会生成一个密钥对，私钥存储在本地，公钥发送给服务端作为用户信息存储，当用户进行登录操作时，服务端会用公钥加密一段信息发送到你的设备上，只有拥有正确私钥的设备才能解密并完成二次认证。

优点

• 必须通过两种及以上的验证才能确认身份，安全性较高

 

缺点

• 使用门槛变高，登录多了一步，费时且麻烦，不有利于产品的广泛传播
• 2FA 不意味着账户的绝对安全，入侵者依然可以通过克隆SIM卡、盗取cookie或token等方式进行攻击
• 一旦忘记密码或者遗失手机，想要恢复登录，势必就要绕过双因素认证，这就形成了一个安全漏洞。除非准备两套双因素认证，一套用来登录，另一套用来恢复账户。

Web验证的未来 WebAuthn

 

WebAuthn是什么？

• WebAuthn是由W3C万维网联盟发布的 Web 标准。WebAuthn 是FIDO联盟指导下的FIDO2项目的核心组成部分。WebAuthn的目标就是提供一系列标准化的协议，让用户告别过去繁琐且不安全的账号密码登录方式，以实现安全的无密登录体验为目的。
• WebAuthn 彻底抛弃了传统的账号密码登录方式，它允许用户直接使用设备的指纹识别、面部识别、虹膜识别、声音识别、实体密钥（USB连接、蓝牙连接、NFC连接）等方式来进行登录验证。

体验WebAuthn

https://demo.yubico.com/webauthn-technical/registration

• windows 10 用户可以购买型号为yubikey 5 NFC版密钥，插入设备的USB接口后访问以上网址体验WebAuthn。
• 有touch bar功能的macbook可以直接访问以上网址体验WebAuthn。
• iphone 用户可以购买型号为yubikey 5 NFC版密钥，打开以上网址后将密钥放在手机背后通过密钥NFC的验证功能体验WebAuthn。
• Android/ target=_blank class=infotextkey>安卓用户可以在手机开启GMS服务并升级Google Play为最新版后访问以上网址体验WebAuthn。

 

 

 

优点

• 使用WebAuthn进行账号登录的安全性非常高
• 即不需要输入密码，又不需要征求第三方授权，直接利用设备的生物识别功能，登录流程非常简单快速，有利于产品的广泛传播

缺点

• 目前还不成熟，国内大部分站点都不支持使用WebAuthn登录

 

WebAuthn学习资料

1. 想要快速了解WebAuthn可以参考我的PPT，并结合Demo源码来学习

PPT：https://ppt.baomitu.com/d/129a784a
Demo源码：https://github.com/hanyonggang/WebAuthnDemo

2. 有关WebAuthn详细用法，可以查阅W3C或MDN的官方文档。

总结

WebAuthn的无密登录体验无论在安全性方面还是在易用性方面都是未来更好的选择，预计在不久的将来有望成为主流的Web验证方式。也希望我们能够早日使用上这样的无密登录体验吧！

希望本文能帮助到您！

点赞+转发，让更多的人也能看到这篇内容（收藏不点赞，都是耍流氓-_-）

关注 ｛我｝，享受文章首发体验！

每周重点攻克一个前端技术难点。更多精彩前端内容私信 我 回复“教程”

原文链接：https://mp.weixin.qq.com/s/-PlSYKTgu9h-bYMknTKNkw

作者：韩永刚