uniapp app 跳转到微信小程序

文章发布于2021年03月15日 16:20, 归类于: 前端

相关网站

微信开放平台

参考文档

plus.share.getServices

打开小程序的参数

plus.share.ShareService.launchMiniProgram

步骤

  1. 登录微信开放平台微信开放平台,申请移动应用,并且将移动应用关联到需要跳转到的小程序。

uniapp app 跳转到微信小程序

uniapp app 跳转到微信小程序

uniapp app 跳转到微信小程序

  1. 打开 HBuilder X-manifest.json-App模块设置-Share(分享)-微信分享 填入在微信开放平台申请的移动应用的 Appid,iOS 的还需要申请 iOS 通用链接填入。

app 跳转到微信小程序

  1. 获取分享服务 plus.share.getServices(successCB, errorCB)
plus.share.getServices(res => {})

获取设备的分享服务,返回的内容如下:

[{
	"id": "weixin",
	"description": "微信",
	"authenticated": true,
	"nativeClient": true
}, {
	"id": "qq",
	"description": "QQ",
	"authenticated": true,
	"nativeClient": true
}, {
	"id": "sinaweibo",
	"description": "新浪微博",
	"authenticated": false,
	"accessToken": "",
	"nativeClient": true
}]
  1. 跳转到小程序 obj.launchMiniProgram(options, successCB, errorCB)
属性 说明 示例
id 关联微信小程序的原始ID("g_"开头的字符串) gh_a857b24c70de
path 打开小程序的页面路径,不传默认跳转首页 /pages/index/index?id=123
type 微信小程序版本类型,可取值: 0-正式版; 1-测试版; 2-体验版。 默认值为0。 0

示例代码

<template>
	<button @click="go">App 跳转到小程序</button>
</template>

<script>
	export default {
		data() {
			return {
				sweixin: null
			};
		},
		methods: {
			go() {
				// #ifdef APP-PLUS
				plus.share.getServices(res => {
					this.sweixin = res.find(i => i.id === 'weixin')
					if (this.sweixin) {
						this.sweixin.launchMiniProgram({
							id: 'gh_a857b24c70de',
							path: '/pages/index/index?id=123',
							type:0
						}, res => {
							console.log('res', JSON.stringify(res))
						}, err => {
							console.log('err', JSON.stringify(err))
						})
					} else {
						// 没有获取到微信分享服务
					}
				}, err => {
					// 获取分享服务列表失败
				});
				// #endif
			}
		}
	};
</script>

<style>
	button {
		margin: 30upx;
	}
</style>

其他

  1. 确定开放平台申请的移动应用关联了小程序。

  2. manifest.json 分享配置里面填移动应用的 Appid。

  3. launchMiniProgram 参数,id 为关联小程序的原始 id,"g_"开头的字符串,非小程序的 Appid。

  4. 如果跳转到小程序失败,提示bad_param:

请确定原始 id 填写正确;

使用iOS设备跳转时,确定已经在 manifest.json 分享配置填入了iOS 通用链接;

  1. App 打包正式版测试,而不是在测试基座测试。

转载请注明来源:《 uniapp app 跳转到微信小程序》- rojerYong's Blog

文章链接:https://www.eoway.cn/article/1615796402.html

如果此文摘取了你的原创,请联系本站管理员,将对此文修改、删除处理。

--END--
上一篇:uniapp 苹果授权登录 下一篇:js常用方法