接入概述

本文为您介绍H5页面一键登录的完整交互流程,涉及界面交互、网页端SDK方法调用及服务端集成的OpenAPI调用。

Demo体验

请扫描下方二维码,体验H5页面一键登录功能。

image..png
说明

温馨提示:体验时建议关闭手机Wi-Fi网络连接,使用手机移动网络访问测试网址。

一键登录的交互流程

一键登录交互流程主要分为四个步骤:SDK初始化、唤起授权页面、用户同意授权并登录、服务端取号。

image..png
说明

上图为完整的交互流程时序图。

流程步骤

  1. 初始化

    1. 用户访问H5页面H5页面调用服务端集成的GetAuthToken接口获取Token(包括业务鉴权accessTokenAPI鉴权jwtToken两个参数)。

    2. H5页面调用SDKcheckLoginAvailable方法发起身份鉴权。

    3. 鉴权成功后展示登录界面。

  2. 唤起授权页面

    1. 用户点击H5页面的“登录”按钮,调用SDKgetLoginToken方法进行预取号。

    2. 获取到带有掩码的手机号后,唤起二次弹窗授权页,授权页会展示待补充完整的号码及运营商协议。

      重要
      • 一键登录或注册需用户确认授权方可使用,且登录按钮文字描述必须包含“登录”、注册按钮文字描述必须包含“注册”等文字,不可诱导用户授权以及通过任何技术手段跳过或模拟此步骤,否则我方有权停止服务并追究相关法律责任。

      • 对于接入移动认证SDK并上线的应用,阿里云对上线的应用授权页面做审查,若出现未按要求弹出或设计授权页面的,将停止应用的一键登录或注册服务。

  3. 用户同意授权并登录

    1. 用户输入手机号中间四位数字并同意相关协议。

    2. 单击授权页面的登录或注册按钮,SDK会根据用户输入的掩码返回换号spToken。

  4. 服务端取号

    1. H5页面调用服务端集成的GetPhoneWithToken接口,换取用户完整手机号。

    2. 服务端获取到用户完整手机号,可自行实现登录或注册业务逻辑,并返回结果给H5页面

    3. H5页面获取到登录状态,关闭授权弹窗。