TapTap标注：登录及注册篇

点击⑦微信 icon：

• 若为已授权微信账号，则自动登录，并获取用户身份信息，返回之前页面，登录成功；
• 若为未授权微信账号，则跳转至微信授权登录页面，用户授权登录后，获取新用户身份信息并创建新用户账号，返回之前浏览页面，登录成功。

（详情参考微信接口文档）

点击⑧QQ icon：

• 点击进入QQ授权登录页面，点击“QQ授权登录”。若为已授权QQ账号，并获取用户身份信息，返回之前页面，登录成功。若为未授权QQ账号，用户点击“QQ授权登录“后，获取新用户身份信息并创建新用户账号，返回之前浏览页面，登录成功。
• 点击进入QQ授权登录页面。

（详情参考QQ移动应用接入要求）

⑨ 验证码悬浮框

（验证码悬浮框）

功能描述：用户输入所接收到的6位数字验证码，进行验证码的验证，验证通过则登录成功。

交互说明：

验证码悬浮框弹出时，背景暗化，视觉上突出验证码悬浮框(灯箱效果），同时在页面底部弹出数字键盘。

（注：验证码悬浮框不能遮挡LOGO）

a. 关闭

需求描述：点击，关闭验证码悬浮框，灯箱效果消失，返回至手机登录及注册页面。

b. 手机验证码输入框

需求描述：点击手机验证码输入框，在无数字键盘的情况下，可从手机底部再次弹出数字键盘。

用户在输入字符时，必须按顺序从左至右依次输入6个数字，并且会给予用户当前所输入字符的位置提示，如图所示：

用户输入完6位数字后，且有网络连接，后端校验，是否符合条件：

• a. 用户输入的验证码与所发送的验证码短信内的验证码一致
• b. 用户所输入的验证码，距离最近一次所发送的验证码时间间隔不超过15分钟。

若不满足a/b两者条件，则6个输入框边框全变红色，并以红色文字提示用户“验证码错误”，如下图所示：

（编辑：衢州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!