微信公众号、微信小程序调用第三方api（百度人脸实名认证），设置回调页面，页面交互处理
使用场景在做人脸识别认证时，使用的是H5版，需要传给插件两个回调页面，一个成功认证后回调，一个失败后回调。这两个页面是要放在服务器的，此时页面与手机端的页面不好做数据和功能交互，于是就需要下面的处理方式。首先是服务器需要的回调页面<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8" />
·
使用场景
在做人脸识别认证时，使用的是H5版，需要传给插件两个回调页面，一个成功认证后回调，一个失败后回调。这两个页面是要放在服务器的，此时页面与手机端的页面不好做数据和功能交互，于是就需要下面的处理方式。
首先是服务器需要的回调页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
/>
<title>成功回调页面</title>
</head>
<body>
<!--微信小程序 JS-SDK 如果不需要兼容微信小程序，则无需引用此 JS 文件。 -->
<script
type="text/javascript"
src="https://s3.pstatp.com/toutiao/tmajssdk/jssdk-1.0.1.js"
></script>
<!-- uni 的 SDK -->
<script
type="text/javascript"
src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"
></script>
<!-- 在引用依赖的文件后，需要在 HTML 中监听 UniAppJSBridgeReady 事件触发后，才能安全调用 uni 的 API。-->
<script type="text/javascript">
document.addEventListener("UniAppJSBridgeReady", function () {
//此处有两种方式
//1，通过路由，跳转到前端的结果页
uni.reLaunch({
url: "/pages/success/success",
});
//2，通过传递消息方式
uni.postMessage({
data: {
path: "/pages/success/success",
message: "postMessage",
},
});
});
</script>
</body>
</html>
前端加载人脸识别认证的H5版
<template>
<web-view v-if="url" :src="url" @message="bindMessage"></web-view>
</template>
<script>
import { CALLBACKURL, VERIFY_TOKEN } from '../../utils/common.js';
export default {
data() {
return {
url: null
};
},
onLoad() {
//存储的后端回调地址
const callback = uni.getStorageSync(CALLBACKURL);
//存储的调用人脸认证的参数token
const token = uni.getStorageSync(VERIFY_TOKEN);
//小程序中，因为业务域名的关系，需要后台开辟一个地址，使用nginx代理到真正的认证H5地址
const baseUrl = `https://XXXX/face/print/?token=${token}&successUrl=${callback}&failedUrl=${callback}`
this.url = baseUrl;
},
methods:{
bindMessage(e){
//如果通过消息机制，可以在这里处理数据，和进行页面跳转逻辑
console.log('接收到的消息：' + JSON.stringify(e.detail.data));
}
}
}
</script>
<style lang="scss">
</style>
魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。
更多推荐
1
0- 0
已为社区贡献1条内容
所有评论(0)