小程序和app之间跳转
小程序方面需要用户主动触发才能打开 APP,不由 API 来调用;
<button open-type="launchApp" app-parameter="wechat" binderror="launchAppError">打开APP</button>
当小程序从 APP 分享消息卡片的场景打开(场景值 1036) 或从 APP 打开的场景打开时(场景值 1069),小程序才会获得打开 APP 的能力,此时用户点击按钮可以打开分享该小程序卡片/拉起该小程序的 APP。即小程序不能打开任意 APP,只能 跳回 APP
APP 需要接入 OpenSDK,Android 第三方 app 需要处理 ShowMessageFromWX.req 的微信回调,iOS 则需要将 appId 添加到第三方 app 工程所属的 plist 文件 URL types 字段。
小程序和h5之间跳转
h5主动唤起小程序:使用wx-open-launch-weapp开放标签,
wx.config({
debug: false, /** 生产环境需要关闭debug模式 测试环境下可以设置为true 可以在开发者工具中查看问题 */
appId: getMsg.appId, /** appId通过微信服务号后台查看 */
timestamp: getMsg.timestamp, /** 生成签名的时间戳 */
nonceStr: getMsg.nonceStr, /** 生成签名的随机字符串 */
signature: getMsg.signature, /** 签名 */
jsApiList: [ ],
openTagList: ['wx-open-launch-weapp']
在页面中引入
<wx-open-launch-weapp
class="launchBtn"
id="launch-btn"
appid='xxxxxxxxxx'
:env-version="enVersion"
:path="'pages/transfer/index?shopId='+storeInfo.mbkId+'&phone='+tel+'&accessToken='+accessToken"
>
<script type="text/wxtag-template">
<style>
.chatBtn {
height:48px;
font-size: 16px;
background: transparent;
border:none;
color: #333333;
display:flex;
align-items:center;
justify-content:center;
margin:0 auto
}
</style>
<button class="chatBtn" >进入店铺</button>
</script>
</wx-open-launch-weapp>
小程序跳转到h5,用到的是小程序的web-view(个人类型的小程序暂不支持使用,业务域名需要配置,开发过程可以设置不校验域名),建议另外新建一个页面,单独放置可以返回上一页的
<web-view src="https://test.com/index.html"></web-view>
h5跳回小程序:在内嵌的网页里引入js,调用wx.miniProgram.navigateTo
跳转小程序方法,可在url后拼接要传的参数:
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script>
wx.miniProgram.navigateTo({url: '/index/index?id=123'})
</script>
或者参考 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/staticstorage/jump-miniprogram.html
h5跳转到app
微信H5不能直接跳转到APP的相应页面,只能引导下载APP,或者打开app
如果已经下载了app
window.location.href = 'app的协议'
如果没下载
window.location.href = 'app的下载地址'
无法直接判断本地是否安装了 app,所以我们需要采取其他方式解决这个需求。
采用设置一个延迟定时器 setTimeout 的方式,第一时间尝试唤起 app,如果 1000ms 没有唤起成功,则默认本地没有安装 app,1000ms 以后,将会触发下载行为。
window.location.href = 'app的协议';
setTimeout(function() {
window.location.href = 'app的下载地址'
},1000)