uniapp开发的App（安卓）端跳转uniapp微信小程序-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp开发的App（安卓）端跳转uniapp微信小程序。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

本文总结两种跳转方法:！！！适合自己的才是最好的

1、根据微信开放文档提供的方法获取小程序的URL （两种）

! 小程序的URL Scheme

weixin://dl/business/?t= *TICKET*

!! 小程序的URL Link

https://wxaurl.cn/*TICKET* 或 https://wxmpurl.cn/*TICKET*

uniapp跳转小程序,uni-app,微信小程序,小程序

代码实现：！！！切记本案例是前端调用，应该让后端封装调用（为了安全考虑）

<view class="button">
	<button type="primary" @click="getUniappURL">跳转小程序</button>
</view>

methods: {
	getUniappURL() {
		let params = {
			// path：要跳转到的小程序的目标页面纯路径（不要拼接参数）
			// 注意：如果该链接要打开的版本是正式版，则这个path一定要已经发布到了正式版，不然无法访问到该页面则链接无法生成成功
			path: '/pages/index/insex',
			query: 'a=1&b=2', // 短链的入参
			env_version: "release", // 正式版
			expire_type: 1,
			expire_interval: 30,
		}
		this.getAppLink(params)
	},
	getAppLink(params) {
		// AppID(小程序ID)
		const appid = 'wx******cf'
		// AppSecret(小程序密钥)
		const secret = 'afe3d06*******975dcbe4'
		let tokenURL = ''
		let urllink = ''
		// #ifdef APP
		tokenURL = `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appid}&secret=${secret}`
		// #endif
		// 先发起请求获取凭证2小时内有效
		uni.request({
			url: tokenURL,
			method: 'GET',
			success(res) {
				// #ifdef APP
				urllink = `https://api.weixin.qq.com/wxa/generate_urllink?access_token=${res.data.access_token}`//获取 URL Link
                //urllink = `https://api.weixin.qq.com/wxa/generatescheme?access_token=${res.data.access_token}`//获取 URL Scheme
				// #endif
				// 再发起请求获取url
				uni.request({
					url: urllink,
					method: 'POST',
					data: {
						...params
					},
					success(result) {
						console.log('生成网址：', result.data.url_link);
						// #ifdef APP
                        //通过uniapp内置组件web-view跳转该链接
						uni.navigateTo({
						    url: `/pages/webView/webView?url=${result.data.url_link}`,
						});
						// #endif
					},
					fail(err) {
						console.log(err);
					}
				})
			},
			fail(err) {
				console.log(err);
			}
		})
	},
}

以上可以拿到小程序的两种URL 链接

vebView页面代码：

<template>
	<view>
		<web-view :src="url"></web-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: ''
			};
		},
		onLoad(options) {
			this.url = options.url;
		}
	};
</script>

2、通过App的微信分享跳转微信小程序

！！！打包App时需要在manifest.json中APP模块配置Share中微信分享保持开启

uniapp跳转小程序,uni-app,微信小程序,小程序

代码实现：

！！！ $appJumpMiniPro方法我放在了vue原型上

！！！需要小程序的原始ID：以gh_开头的id

<view class="button">
	<button type="primary" size="mini" @click="$appJumpMiniPro('/pages/index/index?basURL=report')">跳转</button>
</view>

$appJumpMiniPro(url)方法：！！！记得在main.js上挂载否则无效~

Vue.prototype.$appJumpMiniPro = function(url) {
	// 获取分享服务列表
	plus.share.getServices(
		res => {
			let sweixin = '';
			for (var i = 0; i < res.length; i++) {
				let t = res[i];
				if (t.id == 'weixin') {
					sweixin = t;
				}
			}
			if (sweixin) {
				sweixin.launchMiniProgram({
						id: 'gh_****ab42', // 要跳转小程序的原始ID
						path: url, //  可带参数
						type: 2 // 微信小程序版本类型可取值： 0-正式版； 1-测试版； 2-体验版。 默认值为0。
					},
					// 目标小程序点击返回App后执行的回调，在此接收微信小程序传递的参数
					res2 => {
						console.log(typeof res2, res2)
						// res2是微信小程序传递回来的参数 类型为string 需转化为js对象使用
						let result = JSON.parse(res2)
						console.log(result)
						// 拿到参数后执行你需要的逻辑
					},
					err2 => {
						console.log(err2)
					}
				);
			} else {
                // 没有获取到微信分享服务
				uni.showToast({
					icon: 'none',
					title: '当前环境不支持微信操作!'
				})
			}
		},
		err => {
            // 获取分享服务列表失败
			console.log(err)
		}
	)
}

到此结束~以上是App跳转微信小程序的两种方法，适合自己的才是最好的文章来源地址https://www.toymoban.com/news/detail-717361.html

到了这里，关于uniapp开发的App（安卓）端跳转uniapp微信小程序的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！