前言

实际开发中,小程序和H5往往有很多业务场景需要来回跳转这里主要介绍三种跳转方式大家参考
场景微信程序登录有时候需要和公众号进行绑定获取公众号codeappid传给后台进行绑定


一、webview标签返回程序

1.小程序启动页面只写webview标签跳转授权页面

<template>
	<web-view src="https://www.xxx.cn/auth.html"></web-view>
</template>

2.编写auth.html

<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"&gt;</script>
<script type="text/javascript">
		let url = window.location.href;
		if(url.includes(code)) {
			if (wx.miniProgram) {
				wx.miniProgram.reLaunch({
					url: `/pages/home/index?code=${url中的code}&amp;appId=${url中的appid}`,
					success: function() {
						......
					},
					fall: function() {
						......
					}
				})
			}
		} else {
			window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=自己appid&amp;redirect_uri=还是当前页面&amp;response_type=code&amp;scope=snsapi_userinfo&amp;state=STATE#wechat_redirect"
		}
	</script>

3、把auth.html放到服务器可以测试访问打开程序默认进入启动页面中的webview跳转到H5,授权成功后,通过wx.miniProgram.reLaunch方法携带参数跳回小程

二、wxopen-launch-weapp

1.编写auth.html

<div id="app">
		<wx-open-launch-weapp id="launch-btn" username="原始ID" path="赋值自己path页面">
			<template>
				<button class="btn">跳转小程</button>
			</template>
		</wx-open-launch-weapp>
	</div>
	<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
	<script type="text/javascript">
		let url = window.location.href;
		//如果url包含code说明授权成功,开始注册微信config
		if(url.includes(code)) {
			//通过接口拿到appId,nonceStr,signature,timestamp
			wx.config({
				debug: false,
				appId,
				timestamp,
				nonceStr,
				signature,
				jsApiList: ['chooseImage', 'previewImage'], //必写,否则不显示
				openTagList: ['wx-open-launch-weapp']//必写,否则不显示
			});
		} else {
			window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=自己的appid&amp;redirect_uri=还是当前页面&amp;response_type=code&amp;scope=snsapi_userinfo&amp;state=STATE#wechat_redirect"
		}
	</script>

2、公众号后台配置好相应的域名ip白名单,把auth.html放到服务器可以测试访问点击按钮跳转小程首页(标签中的path属性),在onLoad函数获取参数

在这里插入图片描述

三、URL Scheme

接口用于获取小程scheme 码,适用于短信、邮件外部网页微信内等拉起小程序的业务场景通过接口可以选择生成到期失效和永久有效的小程序码,有数量限制,目前仅针对国内非个人主体的小程序开放

1.HTTPS 调用

 POST https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN 

在这里插入图片描述

2.返回示例

{
  "msg": "操作成功",
  "code": 200,
  "data": {
    "openlink": "weixin://dl/business/?t=WqDMv7uIy7g"
  }
}

3.调用,微信内打开跳转的是正式版,微信外可以跳转体验版和开发板,具体通过env_version参数设置小程序版本

我这里是写个html文件通过a标签访问

<a href="weixin://dl/business/?t=WqDMv7uIy7g">跳转小程序</a>

原文地址:https://blog.csdn.net/qq_41939902/article/details/128939872

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任

如若转载,请注明出处:http://www.7code.cn/show_21358.html

如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱suwngjj01@126.com进行投诉反馈,一经查实,立即删除

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注