跳到主要内容

跳转电子签小程序

1.自有小程序跳转电子签小程序

参考文档:wx.navigateToMiniProgram(Object object) | 微信开放文档

示例代码:

1.在需要跳转的小程序页面的 js 文件中添加代码,例如:

onTapJumpMiniProgram: function() {
wx.navigateToMiniProgram({
appId: 'wxa023b292fd19d41d', // 电子签appId
path: 'pages/home/index', // 跳转的页面路径,可选,默认跳转到目标小程序首页
extraData: { // 需要传递给目标小程序的数据,可选
foo: 'bar'
},
envVersion: 'release', // 目标小程序版本号,可选,默认跳转到正式版
success(res) {
// 成功跳转到目标小程序后的回调函数
},
fail(res) {
// 跳转失败的回调函数
}
})
}

2.在需要进行跳转的按钮上添加一个点击事件,例如:

<button bindtap="onTapJumpMiniProgram">跳转到目标小程序</button
>,注意拉起小程序拉起小程序需要用户点击,且不要使用异步调用!

3.如果需要使用半屏方式拉起,详情参考 wx.openEmbeddedMiniProgram(Object object) | 微信开放文档 注意调用方式要使用同步调用,参数见普通跳转。

2.自有公众号跳转电子签小程序

自有公众号跳转电子签小程序有三种方式:

2.1.公众号菜单中跳转

在自己的公众号中关联电子签小程序,可以通过在菜单中配置小程序链接。参考以下步骤:

第一步:登陆自己的公众号后台 https://mp.weixin.qq.com 第二步:微信公众号管理员在 【广告与服务>小程序管理>添加>关联小程序】中搜索并关联「腾讯电子签」小程序 关联小程序 第三步:在【内容与互动>自定义菜单】中选择一个子菜单,其消息类型选择「跳转小程序」,选择「腾讯电子签小程序」后保存并发布,即可完成快捷跳转设置 小程序自定义菜单

2.2.公众号文章中跳转

在公众号文章中添加小程序,参考以下文档: 文档中添加小程序

获取小程序路径的方式,请参考文档 - 关于小程序路径 path 的获取

2.3. 公众号 H5 中跳转

如果您具备研发能力,有自己公众号内的 h5,可以在业务页面中嵌入电子签 h5 静态网址,拉起腾讯电子签小程序

参考 自有 H5 跳转电子签小程序

3.自有 APP 跳转电子签小程序

官方参考文档:功能介绍 | 微信开放文档

注意,该跳转方式需要 开发者在微信开放平台账号下申请移动应用并通过审核后,才可获得移动应用拉起小程序功能权限。

接入步骤

1.申请移动应用并通过审核后,接入微信 SDK,下载地址请参考官方文档,Android 和 iOS 的接入方式都有明确说明。

2.参考关于小程序路径 path 的获取,获取小程序的 path 路径。

3.举个例子,Android 端 App 拉起小程序的代码片段

String appId = "wxa023b292fd19d41d"; // 填移动应用(App)的 AppId,非小程序的 AppID
IWXAPI api = WXAPIFactory.createWXAPI(context, appId);

WXLaunchMiniProgram.Req req = new WXLaunchMiniProgram.Req();
req.userName = "gh_da88f6188665"; // 填小程序原始id
req.path = "pages/home/index"; ////拉起小程序页面的可带参路径,不填默认拉起小程序首页,对于小游戏,可以只传入 query 部分,来实现传参效果,如:传入 "?foo=bar"。
req.miniprogramType = WXLaunchMiniProgram.Req.MINIPTOGRAM_TYPE_RELEASE;// 可选打开 开发版,体验版和正式版
api.sendReq(req);

上述代码可以拉起电子签小程序,如果需要接收小程序回调返回,可以详细查看微信官方文档。

4.自有 H5 跳转电子签小程序

这种接入方式可以实现在业务方的 h5 中直接进入电子签小程序签署页签署用户合同,前提条件是,是需要业务方先通过接口获取电子签签署 H5 链接,电子签签署 H5 链接获取方式.

参考 获取跳转小程序查看或签署链接

注意,该方式需要业务方后端集成电子签 API 的方式来调用,前端获取到跳转电子签小程序的 h5 链接之后,可以嵌入自有 h5 流程

代码示例

// 定义获取电子签 H5 签署链接 URL 的函数
async function getElectronicSignUrl() {
const response = await fetch('/api/getSignUrl'); // 假设业务端后台封装的获取签署链接的接口为 /api/getSignUrl
const data = await response.json(); // 假设返回的数据格式为 JSON
return data.url; // 返回电子签 H5 签署链接 URL
}

// 在页面加载完成时执行的函数
async function onPageLoaded() {
const url = await getElectronicSignUrl(); // 获取电子签 H5 签署链接 URL
// 将 URL 放到一个 <a> 标签的 href 属性中
document.querySelector('#signLink').setAttribute('href', url);
}

5.关于小程序路径 path 的获取

提示

小程序的路径建议您通过腾讯电子签提供的 API 动态获取。这样可以永久的保证路径为最新。防止出现小程序路径迁移或失效,导致无法打开小程序的问题。

可通过以下的接口获取到小程序路径: