APP跳转小程序，小程序跳转APP

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

关注公共号，搜索 "APP跳转小程序，小程序跳转APP",查看原文

前置条件：

开发环境：windows
开发框架：uni-app , H5+，nativeJS，mpvue
编辑器：HbuilderX

4. 兼容版本：安卓已作测试,IOS未测试

App开发用的是uni-app

小程序开发用的是mpvue

1. APP 跳转小程序

文档地址:

https://uniapp.dcloud.io/api/plugins/share

相关错误代码：

https://ask.dcloud.net.cn/article/287

1.1 首先需要在微信开放者平台将APP和微信小程序关联起来

1.2 如果需要APP直接跳转小程序，小程序内无需其他操作和参数传递，建议调用示例代码中 toweChats 方法；如果从APP内跳转到小程序，需要做一些逻辑操作和传递参数，建议使用示例代码中 shareWeChats 方法

1.3 shareWeChats 里面的参数建议从后端获取，这样方便维护

1.4 使用 shareWeChats 方法跳转APP传参，如果小程序内没有接收到传递的参数，可以在miniProgram对象里面添加 query:"" 的属性，小程序那边成功接收到参数以后，就可删除 query 属性了

2. 在APP内：需要跳转到小程序的页面调用如下代码:

2.1 此处跳转到小程序的index页面，传递的参数是 pid=49&name=云上的日子

// APP 跳转小程序
var appToWtchats={
// 直接跳转跳转到微信小程序(直接跳转，小程序无法返回到APP)
toweChats:function(appId){
if(appId==undefined){
appId="gh_123456";
}
//获取当前显示的webview
var pages = getCurrentPages()
var page = pages[pages.length - 1]
var currentWebview = page.$getAppWebview()
//调用H5+APP的扩展API
var shares=null;
// let that = this
var pusher = plus.share.getServices(function(s){
shares={};
for(var i in s){
var t=s[i];
shares[t.id]=t;
}
var sweixin=shares['weixin'];
// 此处appId为小程序的原始id
sweixin.launchMiniProgram({
id:appId //要跳转小程序的原始ID
})
}, function(e){
console.log("获取分享服务列表失败："+e.message);
});
//放入当前的webview
currentWebview.append(pusher);
},
// app 分享到小程序（小程序可以返回到APP）
shareWeChats:function(obj){
obj = obj || {}
uni.share({
provider:'weixin',
// 分享出去的场景 WXSceneSession、WXSenceTimeline
scene:obj.scene || "WXSceneSession",
/*
分享形式 0 图文 5小程序
仅支持分享微信小程序到微信聊天界面，想进入朋友圈需改为分享图片方式，在图片中包含小程序码。一般通过canvas绘制图片，插件市场有很多生成图片的插件
https://uniapp.dcloud.io/api/plugins/share
*/
type:obj.type || 5,
// 缩略图，小于20Kb的图片
imageUrl:obj.imageUrl || 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-uni-app-doc/962fc340-4f2c-11eb-bdc1-8bd33eb6adaa.png',
// 分享标题
title:obj.title || '欢迎体验地毯汇小程序',
miniProgram: {
// 小程序原始ID
id:obj.miniProgram.id || 'gh_2bcfe97e74d5',
/*
小程序打开的页面，路径以pages/index开头
*/
path:obj.miniProgram.path || 'pages/index/main?pid=49&name=云上的日子',
// 微信小程序版本类型，可取值：0-正式版；1-测试版；2-体验版。默认值为0。
type:obj.miniProgram.type || 2,
query:"",
/*
兼容低版本的网页链接
微信公众平台里面配置的域名或者接口，webUrl必传，可以为空
webUrl 属性不存在，会无法分享
*/
webUrl:obj.miniProgram.webUrl || 'https://www.123456.net'
},
success: ret => {
console.log("分享到小程序成功",ret);
},
fail: err => {
console.log("分享到小程序失败",err);
}
});
}
}

3. 小程序跳转APP

3.1 在小程序页面周期函数，onLoad里面接收app内传递过来的参数

3.2 小程序跳转APP，必须是从APP分享出来的小程序页面，小程序无法直接跳转APP

文档地址：
https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html

在小程序内：需要跳转到APP使用如下代码：

// 在小程序内
// index页面
<button open-type="launchApp" app-parameter="小程序传递过来的参数" @error="launchAppError">跳转APP</button>
// js
onLoad(e) {
console.log("app内传递到小程序的参数的参数", e)
},
methods: {
// 监听小程序跳转APP发生错误
launchAppError(e) {
console.log("打开APP", e)
}
}

4. app内获取小程序传递的参数，在onShow里面执行如下代码：

4.1 通过 plus.runtime.arguments 获取小程序内传递来的参数

文档地址：
https://www.html5plus.org/doc/zh_cn/runtime.html#plus.runtime.arguments