不论是B/S架构的产品还是C/S架构的产品，基本都需要登录注册。当然，不同产品形态的可能有所不同，简单来区分有以下三种情况：
- 完全不用注册登录：这类产品一般都是工具类产品，比如计算器；
- 需要注册登录才能完整使用产品功能：比如一些读书类工具软件，直接读书不需要注册登录，但是要收藏，添加笔记等操作就需要注册登录；
- 必须注册登录才能够使用：这类APP一般跟我们自身的数据相关性较高，比如支付宝，微信等。
1. 注册登录的意义
注册登录的意义有多种，有针对用户的意义，也有针对产品的意义。
用户要使用产品，会产生很多用户行为（数据），而这些行为（数据）需要与用户唯一的id关联，这个时候就必须进行注册登录了，举个简单的例子，移动通信APP需要用户唯一ID来进行数据的存储，否则数据就乱了。
对产品来说，产品需要收集用户的操作行为，以便于更好的迭代产品以及了解用户，这些数据也需要注册登录才能存储。产品可以利用这些数据来进行分析，比如最近大热的短视频APP抖音，就详细的记录了用户的喜欢，观看时长，用以推荐给用户更多的感兴趣视频。
2. 登录的方式
说了这么多，本篇文章主要分析下登录部分的细节，注册的细节后续再分析。可能有人会说，有多少种注册方式就有多少种登录方式，这么说没错，但也不全对，登录方式主要有以下几种：
| 序号 | 方式 | 说明 |
|---|---|---|
| 1 | 账号登录 | 包括手机号/邮箱/用户名等，比如常用的微信号跟QQ号 |
| 2 | 第三方登录 | 微信登录/QQ登录/微博登录/Google登录 |
| 3 | 生物特征 | 指纹/刷脸/语音 |
| 4 | 关联登录 | 比如闲鱼可用淘宝或支付宝关联登录 |
其中生物特征登录一般出现在金融类APP中，因为涉及到资金安全性的问题，所以每次退出APP再次进去查看资金都需要登录。当然，目前最主要的登录方式仍然是账号登录，本篇文章主要就账号登录来剖析，其它三种方式暂不叙述。
3. 登录/忘记密码流程
在上图中，我们省略了一些判断，比如：
- 账号为空；
- 密码为空；
- 手机号格式不正确；
- 验证码位数错误；
- 密码长度不够；
- 输入栏为空；
上述这些问题其实用交互的办法来解决更好，比如，输入框都为空的时候，让按钮禁用，格式正确之后按钮可用，可以减少无效判断。
4. 交互细节
为了减少一部分后台的判断，部分功能用前端判断即可，比如上文提到的省略部分，除此之外，还有加载中跟提示。
4.1 加载交互
同传统的整屏加载效果不同，这里我建议用按钮局部载入效果体验更好，见下图。
4.2 提示交互
提示以不打断操作为主的toast提示，除非是异常信息，否则别轻易使用diglog对话框弹窗。
4.3 密码输入框
传统设计一般是设计两次输入，用以核对密码是否正确，但为了减少用户输入，提高登录效率，可将密码输入栏增加显示/隐藏开关，便于用户核对密码。
4.4 特殊文字输入
例如手机号，输入后可展示为344格式，比如138 0013 8000；又或者邮箱，输完@前半部分，后缀由用户选择。
5. 功能细节
5.1 要不要保存密码
对于用户来说，登录后退出保存好密码，重新登录体验更好。
5.2 登录方式
采用账号密码+token的方式登录，token的有效期可根据不同公司需求设置，用户每次登录刷新token时间戳。
5.3 异常登录
异常登录的情况大多数单一登录，密码泄露，以及登录过期。
| 异常情况 | 说明 | 提示 |
|---|---|---|
| 登录已过期 | 服务端token过期 | 登录已过期，请重新登录 |
| 密码已被重置 | 密码被修改/重置 | 密码已被重置，请重新登录 |
| 单一登录 | 账号在其它终端登录，密码泄露风险 | 你的账号在其它终端登录，请及时修改密码 |
这里需要说明的是账号是否需要单一登录（一个账号只能登录在一台设备，不允许其它设备同时登录，如果登录则踢掉另外的设备登录态）
6. 其他细节
为了防止短信验证码被恶意获取，可在单击验证码之后弹出二次验证，常见的二次验证有：
- 拼图验证；
- 依次点击文字验证；
- 字母验证码；
- 计算题；
对于登录时候没有网络的情况也应该加以说明，在请求的时候先判断是否有网络，如果没有网络则提示无网环境，以及提供解决办法引导文案。
评论区