DCloud的uniapp集成微信刷脸支付全流程指南

一、技术背景与实现原理

微信刷脸支付基于活体检测+人脸特征比对技术，通过微信支付SDK与硬件设备（如3D摄像头）交互完成身份验证。在uniapp中实现该功能需突破两个关键点：

1. 跨平台兼容性：uniapp作为跨端框架，需通过原生插件调用Android/iOS的微信支付SDK。
2. 硬件交互：刷脸支付依赖设备摄像头与算法模块，需通过原生代码实现硬件层调用。

微信官方提供微信刷脸支付SDK（需申请商业服务权限），其核心流程为：

• 用户发起支付 → 调用SDK启动摄像头 → 活体检测与人脸采集 → 上传特征值至微信服务器 → 返回支付结果。

二、uniapp集成步骤详解

1. 准备工作

• 资质申请：
  • 商户需在微信支付商户平台开通「刷脸支付」功能，获取mch_id和api_key。
  • 申请微信开放平台账号，配置应用签名与包名（Android需package_name，iOS需Bundle ID）。
• 环境配置：
  • uniapp项目需配置原生插件依赖（如uni-plugin-wechat-facepay）。
  • Android项目需在build.gradle中添加微信SDK依赖：

    implementation 'com.tencent.mm.opensdk6.8.0'
    implementation 'com.github.gzu-liyujiang1.0.0' // 示例OCR库（非必须）

2. 原生插件开发（以Android为例）

步骤1：创建原生模块
在nativeplugins目录下创建Android原生插件，实现WxFacePayModule类：

public class WxFacePayModule extends UniModule {
    private IWXAPI api;
    @UniJSMethod(uiThread = true)
    public void initWxPay(JSONObject params, UniJSCallback callback) {
        String appId = params.optString("appId");
        api = WXAPIFactory.createWXAPI(mUniSDKInstance.getContext(), appId, true);
        api.registerApp(appId);
        callback.invoke("init_success");
    }
    @UniJSMethod(uiThread = false)
    public void startFacePay(JSONObject params, UniJSCallback callback) {
        String authCode = params.optString("authCode");
        String totalFee = params.optString("totalFee"); // 单位：分
        // 调用微信刷脸支付SDK
        WxPayFaceRequest request = new WxPayFaceRequest();
        request.setAuthInfo(buildAuthInfo(authCode, totalFee));
        api.sendReq(request);
        // 监听支付结果（需在Activity中实现IWXAPIEventHandler）
    }
    private String buildAuthInfo(String authCode, String totalFee) {
        // 生成符合微信协议的加密字符串（含商户信息、随机数、时间戳等）
        // 示例：使用HMAC-SHA256算法签名
        return "encrypted_auth_info";
    }
}

步骤2：配置插件清单
在plugin.xml中声明权限与依赖：

<platform name="android">
    <manifest>
        <uses-permission android:name="android.permission.CAMERA" />
        <uses-feature android:name="android.hardware.camera" />
    </manifest>
    <source-file src="src/main/java/com/example/WxFacePayModule.java" />
</platform>

3. uniapp前端调用

步骤1：安装原生插件
在manifest.json中配置原生插件：

{
  "app-plus": {
    "plugins": [{
      "id": "uni-plugin-wechat-facepay",
      "path": "nativeplugins/uni-plugin-wechat-facepay"
    }]
  }
}

步骤2：调用API

// 初始化微信支付
const wxFacePay = uni.requireNativePlugin('uni-plugin-wechat-facepay');
wxFacePay.initWxPay({
  appId: 'wxd930ea5d5a258f4f'
}, (res) => {
  console.log('初始化结果:', res);
});
// 启动刷脸支付
function startFacePay() {
  wxFacePay.startFacePay({
    authCode: '用户授权码', // 需通过后端换取
    totalFee: '100' // 金额（分）
  }, (result) => {
    if (result.errCode === 0) {
      uni.showToast({ title: '支付成功' });
    } else {
      uni.showToast({ title: '支付失败', icon: 'none' });
    }
  });
}

三、关键安全规范

1. 数据传输加密：

   • 所有通信需通过HTTPS，敏感字段（如auth_info）需使用商户私钥签名。
   • 示例签名算法（Java）：

     public static String sign(String data, String key) {
         try {
             Mac mac = Mac.getInstance("HmacSHA256");
             SecretKeySpec secretKey = new SecretKeySpec(key.getBytes(), "HmacSHA256");
             mac.init(secretKey);
             byte[] hash = mac.doFinal(data.getBytes());
             return Base64.encodeToString(hash, Base64.NO_WRAP);
         } catch (Exception e) {
             throw new RuntimeException("签名失败", e);
         }
     }

2. 活体检测要求：

   • 必须使用微信认证的硬件设备（如奥比中光3D摄像头）。
   • 禁止绕过活体检测直接调用支付接口。

四、常见问题处理

1. 问题：支付回调未触发

   • 原因：未在Android的WXEntryActivity中实现IWXAPIEventHandler。

   • 解决：在Activity中重写onReq和onResp方法：

     public class WXEntryActivity extends Activity implements IWXAPIEventHandler {
         @Override
         public void onReq(BaseReq req) {}
         @Override
         public void onResp(BaseResp resp) {
             if (resp.getType() == ConstantsAPI.COMMAND_PAY_BY_WX) {
                 // 处理支付结果
             }
         }
     }

2. 问题：iOS提示“未授权使用摄像头”

   • 原因：未在Info.plist中添加NSCameraUsageDescription字段。
   • 解决：在manifest.json的iOS配置中添加：

     "ios": {
       "infoPlist": {
         "NSCameraUsageDescription": "需要摄像头权限以完成刷脸支付"
       }
     }

五、优化建议

1. 离线模式降级：当设备不支持刷脸支付时，自动切换至二维码支付。
2. 用户体验优化：
   • 添加支付进度动画（如uni.showLoading）。
   • 错误提示细化（如“网络超时”“人脸识别失败”）。
3. 日志监控：通过后端记录支付请求日志，便于排查问题。

六、总结

通过uniapp的原生插件机制，开发者可高效集成微信刷脸支付功能。关键步骤包括：申请微信支付资质、开发原生模块、处理加密与回调、遵守安全规范。实际开发中需特别注意硬件兼容性、签名验证及异常处理，以确保支付流程的稳定性和安全性。