@gcores/react-native-yidun-quicklogin v0.7.1

号码认证

直连三大运营商，一步校验手机号与当前 SIM 卡号一致性。优化注册/登录/支付等场景验证流程

平台支持（兼容性）

环境准备

CocoaPods 安装教程

资源引入/集成

npm install @yidun/quickpass-plugin-rn

项目开发配置

旧版本需要在 react-native 工程对应的 android/app/build.gradle 文件的 android 域中添加

repositories {
    flatDir {
        dirs project(':yidun_quickpass-plugin-rn').file('libs')
    }
}

release 包需要添加混淆规则

-dontwarn com.cmic.sso.sdk.**
-keep class com.cmic.sso.**{*;}
-dontwarn com.sdk.**
-keep class com.sdk.** { *;}
-keep class cn.com.chinatelecom.account.**{*;}
-keep public class * extends android.view.View
-keep class com.netease.nis.quicklogin.entity.**{*;}
-keep class com.netease.nis.quicklogin.listener.**{*;}
-keep class com.netease.nis.quicklogin.QuickLogin{
    public <methods>;
    public <fields>;
}
-keep class com.netease.nis.quicklogin.helper.UnifyUiConfig{*;}
-keep class com.netease.nis.quicklogin.helper.UnifyUiConfig$Builder{
     public <methods>;
     public <fields>;
 }
-keep class com.netease.nis.quicklogin.utils.LoginUiHelper$CustomViewListener{
     public <methods>;
     public <fields>;
}
-keep class com.netease.nis.basesdk.**{
    public *;
    protected *;
}

调用示例

export default class App extends Component {
  componentDidMount() {
    NativeModules.QuickLoginPlugin.initQuickLogin('此处填写您申请的业务id');
  }

  handlePressLogin() {
    NativeModules.QuickLoginPlugin.prefetchNumber((success, resultDic) => {
      if (!success) return;

      const token = resultDic.token

      let uiJsonConfig;
      if (Platform.OS==='android') {
        uiJsonConfig = androidConfigJson;
        NativeModules.QuickLoginPlugin.setUiConfig(uiJsonConfig);
        NativeModules.QuickLoginPlugin.login((success, resultDic)=>{
            if (!success) return
            NativeModules.QuickLoginPlugin.closeAuthController();

            fetch('您的后端认证接口', {
                method: 'POST',
                body: JSON.stringify({
                    token,
                    accessToken: resultDic.accessToken
                })
            })
        })
      } else {
        uiJsonConfig = iosConfigJson;
        NativeModules.QuickLoginPlugin.setUiConfig(uiJsonConfig, (success) => {
            if (success) {
                console.log("设置UI成功")
                NativeModules.QuickLoginPlugin.login((success, resultDic)=>{
                    if (!success) return
                    NativeModules.QuickLoginPlugin.closeAuthController();

                    fetch('您的后端认证接口', {
                        method: 'POST',
                        body: JSON.stringify({
                            token,
                            accessToken: resultDic.accessToken
                        })
                    })
                });
            }
        });
      }
    })
  }

  render() {
    return (
      <View>
        <TouchableOpacity onPress={this.handlePressLogin}>
          <View>
            <Text>登录</Text>
          </View>
        </TouchableOpacity>
      </View>
    )
  }
}

更多使用场景请参考 demo

SDK 方法说明

1. 创建对象

代码说明：

import {NativeModules} from 'react-native';
var quichLoginPlugin = NativeModules.QuickLoginPlugin;

2. 初始化

代码说明：

quichLoginPlugin.initQuickLogin('此处填写您申请的业务id');

参数说明：

• 入参说明：

  参数	类型	是否必填	默认值	描述
  businessId	String	是	无	易盾分配的业务 id

3. 预取号

代码说明：

quichLoginPlugin.prefetchNumber((success, data) => {
  if (success) {
    // TODO: 预取号成功处理，可以进行授权页面配置和调起授权页
  } else {
    // TODO: 预取号失败处理
  }
})

参数说明：

• 回调参数说明：

  回调参数	类型	描述
  success	Boolean	预取号成功
  data.token	String	如果预取号成功则返回易盾 token，否则无此字段
  data.desc	String	如果预取号失败，返回错误详情, 否则无此字段

4. 是否具备一键登录能力

代码说明：

quichLoginPlugin.checkVerifyEnable((success) => {
  if (success) {
    // TODO: 具备一键登录能力
  } else {
    // TODO: 不具备一键登录能力
  }
})

参数说明：

• 回调参数说明：

  回调参数	类型	描述
  success	Boolean	是否具备一键登录能力

5. 自定义授权页面

代码说明：

NativeModules.QuickLoginPlugin.setUiConfig(config, (success) => {
    if (success) {
        // TODO:设置UI成功，可以进行取号接口调用
    } else {
    }
});

参数说明：

• 基础参数：

  参数	类型	是否必填	默认值	描述
  config	Object	是	无	自定义配置项
  success	Boolean	设置授权页面 UI 成功

config 可配置项说明： android 版

开发者不得通过任何技术手段，将授权页面的隐私栏、手机掩码号、供应商品牌内容隐藏、覆盖 网易易盾与运营商会对应用授权页面进行审查，若发现上述违规行为，网易易盾有权将您的一键登录功能下线

状态栏

导航栏

应用 Logo

手机掩码

认证品牌

登录按钮

隐私协议

协议详情 Web 页面导航栏

其他

自定义 view

config 可配置项说明： iOS 版

设计规范概览 开发者不得通过任何技术手段，将授权页面的隐私栏、手机掩码号、供应商品牌内容隐藏、覆盖 网易易盾与运营商会对应用授权页面进行审查，若发现上述违规行为，网易易盾有权将您的一键登录功能下线

基础配置

转场动画

自定义控件

背景设置视频

背景设置 Gif

状态栏

导航栏

应用 Logo

手机掩码

认证品牌

登录按钮

隐私协议

若勾选框需要展示，请务必设置勾选框的选中态图片与未选中态图片 协议未勾选时，登录按钮是否可点击可以自定义设置，弹窗提示的样式也可以自定义

弹窗模式

点击事件的回调

6. 调起授权页面

代码说明：

quichLoginPlugin.login((success, data) => {
  if (success) {
    // TODO: 授权成功处理，可以进行关闭授权页、服务端验证等
    NativeModules.QuickLoginPlugin.closeAuthController();
  } else {
    // TODO: 授权失败处理
  }
})

参数说明：

• 回调参数说明：

  回调参数	类型	描述
  success	Boolean	授权是否成功
  data.accessToken	String	如果取号成功返回运营商授权码，否则无此字段
  data.desc	String	如果取号失败，返回的错误详情, 否则返回"取号成功

7. 事件监听

代码说明：

const emitter = new NativeEventEmitter(NativeModules.QuickLoginPlugin)
emitter.addListener('RNQuickLogin', (value) => {
  // TODO: 处理监听事件
})

value 是一个 Map ，里面包含各种 key 和对应的值

• iOS value 值说明：

  回调参数	类型	描述
  value.action	String	authViewDidLoad 表示正在加载授权页authViewWillAppear 表示授权页已经出现 authViewWillDisappear 表示授权页将要消失 authViewDidDisappear 表示授权页已经消失authViewDealloc 表示授权页销毁 appDPrivacy 表示点击了默认协议appFPrivacy 表示点击了议第一个协议点击 appSPrivacy 表示点击了第二个协议 loginAction 表示点击了登录按钮，data.checked = true 表示在点击登录按钮时复选框选已选中反之 checkedAction 表示点击了复选框，data.checked = true 表示复选框已选中反之

• Android value 值说明：

  回调参数	类型	描述
  value.viewId	String	自定义 view 点击，返回自定义 view 的 id
  value.lifecycle	String	onCreate - 页面创建，onStart - 页面已开始活动，onResume - 页面展示，onPause - 页面非活动状态，onStop - 页面已停止，onDestroy - 页面销毁
  value.clickViewType	String	privacy - 隐私协议点击事件，checkbox - 复选框点击事件（含 isCheckboxChecked: 0/1），loginButton - 登录按钮点击事件（含 isCheckboxChecked: 0/1），leftBackButton - 左上角返回按钮点击事件
  value.isCheckboxChecked	String	协议复选框的值，仅在复选框事件和登录按钮点击事件中存在

8. 关闭授权页面

代码说明：

quichLoginPlugin.closeAuthController()

9. 本机校验

在初始化之后执行，本机校验和一键登录可共用初始化，本机校验界面需自行实现

代码说明：

quichLoginPlugin.verifyPhoneNumber(String phoneNumber,(success, data) => {
  if (success) {
    // TODO: 本机校验成功处理
  } else {
    // TODO: 本机校验失败处理
  }
})

参数说明：

• 入参说明：

  参数	类型	是否必填	默认值	描述
  phoneNumber	String	是	无	待校验手机号

• 回调参数说明：

  回调参数	类型	描述
  success	Boolean	授权是否成功
  data.accessToken	String	如果本机校验返回运营商授权码，否则无此字段
  data.desc	String	如果本机校验失败，返回的错误详情, 否则返回"本机校验成功