实际体验过技术派的球友应该知道整个登录是基于微信公众号（个人号）来实现的，那么整套登录流程是怎么设计的呢？如果让我们自己来实现微信扫码登录该怎么去做呢？现在的方式有没有更好的替换方案呢？

这篇内容的风格和其他的文章可能不太一样，我们将以日常工作中一个功能相对完整的需求作为驱动，通过标准的方案设计来进行介绍说明。

方案设计

在产品的需求交底、评审过后，就到了我们研发人员出方案设计的时候。常见的方案设计有以下几个板块：

1. 需求的相关理解及目标
2. 研发的设计方案
   • 相对完整的设计方案
   • 前后端交互方式、接口 API 约定
   • 测试要点
3. 排期
4. 验收标准
5. 上线计划

当然我们这里并不会将所有的板块都填充上，重点会放在前面两点

1. 背景与目标

技术派作为一个文章分享社区，登录是基本的功能点；很多的功能都要求登录之后才能继续，比如发文、点赞、评论等。

2. 设计方案

基于登录这个需求场景，常见的登录方式有最经典的用户名/密码方式，也有近些年来广为普及的手机号/验证码的登录方式以及微信扫码登录。

2.1 用户名密码方式登录

用户名密码的登录方式，属于经典的实现方式，一般来讲，使用这种方式时，除了基础的登录之外，还需要搭配用户注册、忘记密码、修改密码等功能。

如上图，分别给出了注册、登录、忘记密码重置的流程示意图。

基于这种方案，我们的用户表中需要考虑下面几个关键信息

• userName: 用于登录的用户名
• password: 登录密码，注意 db 中不直接存储源码，常见的方案是将用户上传的密码 加盐之后计算 MD5 保存
• email/phone: 主要用于忘记密码时，向用户发送用于修改密码的验证码 or 重置密码的临时 url（主要的目的是确定这个账号真的是 xxx 在操作）

整个方案实现下来中规中矩，重点注意的关键点无非两个：

• 密码注意不要明文存储
• 忘记密码时，需要给用户发送验证码

优点

• 用户注册成本低
• 流程清晰简单、易于理解

缺点

• 接口多，流程多（除了登录还有注册、忘记密码、修改密码等操作），实现工作量相对较大
• 用户容易忘记密码，安全性没有其他的高
• 手机号发送验证码时要花钱；邮箱发送验证码时容易被当作垃圾邮件拉黑

2.2 验证码登录

验证码的登录方式对用户而言体验是比较友好的，也不用记密码，当然也不用担心忘记密码，我们一般说的验证码登录方式专指手机+短信验证码的登录方式，一般的操作流程如下：

从上面的流程示意图可以看出，用户表中核心存储手机号/邮箱即可：

• phone: 采用手机号验证码的方式，存手机号即可
• email: 采用邮箱接收验证码的方式，存邮箱即可

动作有两步：

1. 用户首先输入手机号/邮箱，然后请求技术派发送验证码
2. 登录：提交手机号/邮箱 + 验证码

**优点：**对用户而言操作比较简单，不用记密码，也不用担心忘记密码、重置密码

缺点

• 整个登录流程是分段的，当接收验证码较慢时，可能会阻塞较长的时间
• 手机号接收验证码费钱；邮箱接收验证码对用户体验又不太好（特别是国内手机上使用邮箱的较少）

2.3 基于 APP 的扫码登录

关于扫码登录，对于 pc 站点而言可以说成了标配；当然前提是安装了对应的 app；详情可以参看：

• 技术派之扫码登录实现原理（已完成）

它的基本流程如下图：

一般的 APP 扫码登录，前提是你已经是网站的用户，安装对应的 app 且登录之后，给 pc 站点新增一个免密的登录方式而已；与技术派的实际场景还是有出入的。

基于上面的操作示意图，核心关键点就在于借助 APP 的扫码操作，来识别用户的身份。

优点： 登录方式简单，成本很低

缺点

• 要求用户下载 app
• 实现姿势相比于上面两个会更有难度一点点

2.4 基于微信公众号的扫码登录

技术派当下没有 app，也不确定之后会不会有（😂），我们采用的登录方式是 App 扫码登录的变种，既然我没有 app，就需要借助微信的公众号来做。

虽然登录时展示的是一个二维码，但背后的操作还是挺复杂的。

首先，后端需要和前端构建一个半长连接（后面我会解释），当用户向公众号发送验证码之后，微信公众平台会将用户发送的信息转发给技术派的服务端，通过验证码来识别请求登录的用户身份，找到对应的半长连接，实现用户的自动登录跳转。

基于上面的方案，我们的用户表中需要存储一个用户标识 uuid: 微信公众平台返回的唯一标识

优点

• 对于用户而言登录方式简单，无需记忆密码、用户名，有微信即可
• 对于学习技术派项目的球友而言，又可以学到一个有意思的知识点

缺点

• 实现方式相对前面的复杂一点
• 个人公众号不支持自定义二维码参数，因此还需要输入验证码这一步骤，操作麻烦了一点（企业公众号可以实现扫码之后直接自动登录，无需输入验证码）

3. 方案确定

上面给了几个方案，我们最终选择的是第四个基于微信公众号来登录。因此你需要准备的一个微信公众号，其次就是一台微信公众平台可以回调的服务器。

假如你都没有，只要理解这背后的原理也就足够应对面试了。

实现策略

1. 微信公众平台配置

因为个人公众号能使用的微信公众平台功能较少，主要就是接收用户的发送信息，所以需要的配置也不多，直接登录后台，开启服务器相关配置。

注意，微信公众平台接入时，需要一个 token 验证，即返回它传参的 echostr。