为 React Native 或 Flutter 应用添加身份验证

将身份验证集成到 React Native 或 Flutter 应用中，只需几行代码和一些原生配置即可。 Toden SDK 会渲染整个流程（包括征得同意、选择 ID、采集文档、自拍和活体检测），并自动提交。您拥有的是构建配置、相机权限、您发布的密钥，以及申请人点击提交后您的应用所执行的操作。

最稳妥的方法是：在控制面板中构建工作流，仅通过代码传递用户级数据，并在服务器上读取结果。这样，流程的任何更改都只需重新发布，而无需在应用商店发布，也无需将任何身份数据返回到手机。本文的其余部分将详细介绍每个步骤以及在此过程中需要做出的移动端特定决策。

你实际在应用中添加了哪些内容？

这两个 SDK 都支持设备端原生实时感知：iOS 端使用 Apple Vision，Android 端使用 Google ML Kit。这正是大部分设置的原因。这里的实时感知指的是 Presence Intelligence（实时自拍加上随机手势挑战、屏幕闪烁颜色序列，或两者兼有），它在原生代码中直接运行于相机帧上，而非在 Web 视图中运行。

这两个 SDK 在功能上与 Web 端完全一致。 SDK 对于核心流程、工作流嵌入、捕获插件（联系方式） OTP （例如地址证明、问卷调查）、商业验证以及任何全球文件。它们还增加了一项网络无法实现的功能：读取电子护照和芯片身份证中的芯片信息。 NFC 。

这些构建需要哪些条件？

React Native （在新标签页中打开）和Flutter （在新标签页中打开）的最低要求 SDK 页数：

React Native 系列代码最容易让开发团队措手不及。 SDK 它使用 VisionCamera v5 (Nitro) 帧处理器，这是原生代码，因此无法在 Expo Go 中运行。请从集成的第一天起就规划定制的开发客户端，而不是等到发布前一天。

如何安装？

对于基于 React Native 的 Expo 应用，请安装 SDK 及其同类产品，添加配置插件，并构建开发客户端：

npx expo install @myazahq/kyc-sdk-react-native \
  react-native-vision-camera react-native-vision-camera-worklets \
  react-native-worklets react-native-nitro-modules react-native-nitro-image \
  react-native-safe-area-context react-native-svg

// app.json
{
  "expo": {
    "plugins": ["@myazahq/kyc-sdk-react-native"]
  }
}

npx expo prebuild
npx expo run:ios       # or: npx expo run:android

请勿将 VisionCamera 本身添加到plugins版本 5 没有附带任何配置插件，列出它expo prebuild失败。 Toden 插件添加了 iOS 相机使用字符串和 AndroidCAMERA和INTERNET权限已授予您。裸 React Native 应用会添加 Expo 模块运行时。npx install-expo-modules@latest并手动声明权限； SDK 页面上有确切的命令。

对于 Flutter，添加依赖项并运行flutter pub get：

dependencies:
  myaza_kyc_sdk_flutter: ^2.2.0

然后自行声明是否允许拍摄：NSCameraUsageDescription在ios/Runner/Info.plist， 和CAMERA加INTERNET在AndroidManifest.xml。

用户将看到哪些权限？

始终启用摄像头。仅当工作流程使用地址智能步骤时才启用位置信息。React Native 配置插件默认添加位置字符串（传递）。{ "location": false }选择退出）；在 Flutter 和纯 React Native 中，您需要自行添加它们。在 iOS 上，如果请求位置信息，应用程序会崩溃。NSLocationWhenInUseUsageDescription缺少，因此只要有可能添加地址步骤，就添加它。麦克风，永远不要：语音指导是文本转语音输出，并且 SDK 不会录制音频。最后一点值得添加到您的应用商店隐私设置答案中。

哪些可选的 React Native 模块比较重要？

四expo-*模块是可选的对等组件，每个模块都提供一项功能。大多数团队都会忽略的一点是：expo-document-picker如果没有它，地址证明和商业文件审核步骤就只能接受摄像头拍摄的照片，因此 PDF 银行对账单根本无法提交。expo-device改进设备智能所使用的设备指纹识别功能expo-application记录您提交应用时的版本信息，并且expo-localization给予 SDK 设备所在区域。

应该如何安装流量？

通过 ID 挂载已发布的流程。该流程包含国家/地区、ID 类型、采集步骤、品牌标识和文案，还可以包含服务器端决策规则。React Native：

import { MyazaKYC } from "@myazahq/kyc-sdk-react-native";

export default function VerifyScreen() {
  return (
    <MyazaKYC
      apiKey="pk_test_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
      workflowId="wf_AbC123dEf456"
      userId="user_42"
      userData={{ firstName: "Jane", lastName: "Doe" }}
      metadata={{ requestId: "order_1001" }}
      onSubmit={(submission) => console.log("submitted", submission.verificationId)}
      onError={(err) => console.error(err.code, err.message)}
      onClose={() => console.log("closed")}
    >
      Verify Identity
    </MyazaKYC>
  );
}

Flutter 的打开方式与模态窗口相同。请注意：context是一个命名参数，回调函数位于旁边。config不在里面：

MyazaKYC.show(
  context: context,
  config: const MyazaKYCConfig(
    apiKey: 'pk_test_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx',
    workflowId: 'wf_AbC123dEf456',
    userId: 'user_42',
    userData: UserData(firstName: 'Jane', lastName: 'Doe'),
    metadata: {'requestId': 'order_1001'},
  ),
  onSubmit: (submission) => debugPrint('Submitted: ${submission.verificationId}'),
  onError: (error) => debugPrint('Error: ${error.code}: ${error.message}'),
  onClose: () => debugPrint('KYC closed'),
);

这些片段中有三个细节是刻意安排的。

关键在于是否可发布。只有pk_密钥属于应用程序。Flutter 从其前缀派生环境（pk_test_是沙盒，pk_live_（生产环境），因此切换到生产环境是一项关键变更。可发布密钥可以启动验证，但无法读取其结果。

userId，userData和metadata保持在代码中。工作流程是所有访问者共享的模板，因此它不能包含每个用户特定的值。userData值得一提的是：这是你认为用户拥有的名称，与从文档中读取的名称进行比较后得出的结果。dataMatch把它去掉。dataMatch回来null。

metadata.requestId应该取自您自己的记录。它是提交的幂等键，因此应该从它所属的入职记录中派生出来，而不是每次屏幕加载时都生成一个新的。

为什么选择工作流而不是属性？两种 SDK 都接受完整的配置作为属性，这对于固定流程来说没问题。但在移动端，每次属性更改都会导致应用发布和审核周期，而旧版本应用会保留数月之久。使用工作流，添加 ID 类型或提高人脸匹配阈值等更改会在下次打开流程时应用到所有已安装的版本。工作流产品页面详细介绍了构建器。

申请人提交申请后会发生什么？

onSubmit当服务器接受验证时触发此事件。它并非验证结果。检查是异步运行的，结果通过 webhook 或密钥调用到达您的后端。GET /api/kyc/verifications/:id。onError仅因技术错误（网络、身份验证、信用、上传）而触发警报，绝不会因验证失败而触发警报。

所以移动设备上的模式是：onSubmit发送verificationId向后端显示“我们正在核实您的信息”页面，并让后端在收到 webhook 时告知应用下一步显示什么内容。不要从应用中获取完整结果。这需要一个密钥，而应用二进制文件中的密钥是别人拥有的。

何时 NFC 芯片读取数据有意义吗？

当您的申请人持有电子护照或芯片身份证，并且您需要最高级别的安全保障时，移动 SDK 会通过安全通道读取芯片，服务器会运行被动身份验证：它会将每个数据组的哈希值与芯片的签名安全对象进行比对，并验证签名者是否链接到受信任的颁发状态证书（ CSCA ）经证实被篡改的芯片无法通过验证。chip_not_authentic。

设计时需要考虑的四个限制因素 NFC 芯片文档 （在新标签页中打开）：

• 承保范围取决于证书。芯片植入步骤仅适用于以下国家/地区： Toden 的证书列表涵盖 138 个国家，包括尼日利亚、加纳、肯尼亚、埃及、埃塞俄比亚和塞内加尔。GET /config报告supportsNfc您的账户按ID类型分类。

• 有些芯片无法被任何人读取。南非智能身份证、阿联酋身份证和马来西亚身份证（MyKad）都使用专有芯片应用程序。这些证件仍然需要通过文件检查进行验证。

• 没有手机的手机 NFC 跳过此步骤，跳过此步骤不会导致验证失败。如果芯片缺失或无法读取，则会回退到文件和政府记录检查。

• 芯片扫描步骤在文档扫描之后运行，因为打开芯片安全通道的密钥是从文档的机器可读区派生出来的。

哪些支持芯片的身份证件提供此步骤，以及用户是否可以跳过此步骤，都是构建器中的工作流程设置。 NFC 控制板。

如何控制应用的大小？

在安卓系统上，人脸检测和文本识别使用谷歌机器学习工具包（Google ML Kit）， SDK 这取决于 Play 服务版本，这些版本会在首次使用时下载其模型，而不是将它们捆绑在一起。捆绑下载会给每台设备增加相当大的下载量，因此获取的版本是默认版本。但缺点是，Play 服务版本无法在没有 Google Play 服务的设备上运行，例如华为设备。如果您要将产品发布到这些设备，请进行设置。ext { myazaKycBundledMlKit = true }你的根build.gradle改为将模型打包在一起。

发布 Android 应用包而不是通用应用包 APK 启用 R8 的资源缩减功能，可以进一步减少下载量。 SDK R8 有其自身的消费者规则。

发布前检查清单

• React Native：开发客户端或在 CI 中进行裸构建，绝不使用 Expo Go；启用新架构。

• 已声明相机权限；如果任何工作流程收集地址，则已声明位置字符串；未声明麦克风权限。

• expo-document-picker如果任何工作流程将文档收集为文件，则需要安装此程序。

• 由 ID 挂载的已发布工作流程；userId，userData以及稳定的metadata.requestId从代码传递。

• 一个pk_test_开发构建的关键和pk_live_发布版本中的密钥，绝非秘密密钥。

• onSubmit双手verificationId结果会发送到您的后端；结果来自 webhook。

• NFC 覆盖率已核对supportsNfc为你们服务的国家。

首先使用已发布的测试 ID 在沙盒环境中测试整个路径，然后交换密钥。开发者中心链接了两者。 SDK 指南。