trustdevice

验证码依赖设备指纹检测设备环境，本文档描述了设备指纹SDK和验证码SDK的集成方式

# 后台配置

在字节小程序开发者平台，开发管理 - 开发设置 - 服务器域名

添加request合法域名

https://fp.tongdun.net
https://sphinx.tongdun.net
https://static.tongdun.net

添加downloadFile合法域名

https://sphinx.tongdun.net
https://static.tongdun.net

# 小程序代码集成

# 1. 获取并添加 SDK

联系运营获取最新的设备指纹和验证码 SDK。

将设备指纹SDK添加至小程序适当的目录中，将验证码SDK里的 tdcaptcha 组件文件夹添加至小程序组件components目录下。

# 2. 获取设备指纹 blackbox

设备指纹中使用了 canvas 指纹技术，由于目前小程序的限制，无法通过 JS 来动态创建 DOM 节点，所以需要在集成时手动加入。例如，在 pages/index/index.ttml 页面尾部添加以下代码：

<view>
    <canvas canvas-id='tdcanvas' style="visibility: hidden;position: fixed;z-index: -999;left: 9999px;"></canvas>
</view>

在 pages/index/index.js 文件顶部引用SDK：

import FMAgent from '../../fmsdk/fm-xxx-es.saas.js'

然后在 onLoad 方法中获取设备指纹 blackbox，只需获取一次：

onLoad: function() {
	var that = this;
        // partnerCode-合作方标识，由同盾分配， appName-应用标识，由同盾分配
	var fmagent = new FMAgent({{partnerCode:"", appName:"", env:"PRODUCTION"}});
        fmagent.getInfo({
          page: that, 
          openid: '', // 请传入加密的用户 openid
          // 如果您开通了 unionid 功能，请传入加密的用户 unionid，否则留空即可
          unionid: '', 
          success: function (res) {
             // 获取blackbox成功回调，res 为 blackbox 字符串
             // 可以setData保存到页面，传给验证码API使用
             that.setData({blackbox: res});
          },
         }
        })
   
}

设备指纹 API 参数说明

参数	类型	是否必填	描述	示例
page	Object	是	当前所在的page对象或component对象	that
unionid	String	否	加密后的用户userid；加密算法可以随意选择，请确保加密前后一一对应，建议使用MD5或者SHA256；没有值，请传空字符串	ef54040ea***58fe66157
timeout	Number	否	获取blackbox超时时间，单位毫秒；默认2500，包括采集和发送请求的总时长，范围：2500-16000	6000
noClipboard	Boolean	否	是否不采集剪切板；采集剪切板可部分增强设备指纹恢复能力，部分手机系统会提示采集了剪切板；默认true，不采集	true
success	Function	是	获取成功回调	function(res) {/res即blackbox /}

# 3. 引用 tdcaptcha 组件

在需要使用验证码页面的 .json 文件中，添加使用组件配置

{
  "usingComponents": {
    "td-captcha": "/components/tdcaptcha/captcha/index"
  }
}

# 4. 添加验证码组件

在需要使用验证码页面的 .ttml 文件中，添加验证码组件元素

<td-captcha  tt:ref="captchaRef" id="tdCaptcha"></td-captcha>

# 5. 触发验证

在需要验证码页面的 .js 文件中，添加验证码调用事件及监听事件

onReady() {
    // 兼容组件实例，id与ttml保持一致
    this.selectComponent("#tdCaptcha", res => {
        this.tdcaptcha = res;
    })
   
  },
  
  // captchaRef与ttml里tt:ref保持一致
  // 获取组件实例（2.23支持）
  captchaRef(ref) {
    this.tdcaptcha = ref;
  },
  // 触发验证码方法，比如绑定到登录按钮
  triggerCaptcha: function() {
    // 调用组件API，弹出验证码
    this.tdcaptcha.triggerCaptcha({
      partnerCode: 'XXX',  // 合作方
      appName: 'XXX', // 应用
      env: 1, 
      blackbox: this.data.blackbox || "",  // 设备指纹blackbox,, 
      onSuccess: this.onSuccess, 
      onFail: this.onFail, 
    });
  },
  
  onSuccess: function(validateToken) {
    // 验证通过
    // 将validateToken传递至服务端二次校验
  },

  onFail: function(msg) {
    // todo
  },

# 验证码 API 参数说明

参数	类型	是否必填	描述
partnerCode	String	是	同盾合作方标识
appName	String	是	同盾合作方应用标识
env	Number	是	1：线上生产环境 0：测试环境
blackbox	String	否	同盾设备指纹blackbox
maskClose	Number	否	点击蒙层是否关闭验证码 0：否 1：是
onSuccess	Function	是	验证成功的回调函数，回调函数会把validateToken传递过来
onFail	Function	否	验证失败的回调函数；验证失败会返回新的验证码，此时onFail回传msg为 'opFail'，一般不需要另行处理
onClose	Function	否	验证码弹窗关闭的回调函数，可根据需要自定义
mfaId	String	否	如果您已对接MFA产品，请将MFA流程中接口获取的mfa_id赋值给验证码配置参数, 未对接可以忽略

← 支付宝小程序