本人使用的VUE框架。
代码提示:
1、vue代码;
2、点击事件代码;
3、php代码;
遇到的大坑重要提示:
3、必须是认证服务号;
4、必须是服务号绑定的微信小程序
5、https接口获取服务号的access_token
6、如果你的https接口没有问题,但是你的wx-open-launch-weapp标签没有显示或者点击无反应。有以下原因:
1》、vue代码样式问题,可以根据我的代码写样式,最好写成一样的。
2》、在微信开发者工具没有反应的话,最好在微信客户端试试。
3》、JSSDK版本是1.6.0。
4》、如果框架写上还不行,可以试试在文件main.js中,写上:
Vue.config.ignoredElements = [‘wx-open-launch-app’, ‘wx-open-launch-weapp’];
新增项:
5》、在小程序后台配置上业务域名,域名必须有证书。代码放到服务器上,用业务域名访问。
官方链接参考:
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_Open_Tag.html
还是不行的话,下方留言或者私信我。
1、<template>
<div class=“cnt”>
<div>
<button @click=“onClickOpens”>新开页面跳转</button>
</div>
<div class=“test-position”>
<wx-open-launch-weapp
id="launch-btn"
username="gh_xxxxxxxxxx"
path=“pages/index/index.html?user=123&action=abc”
>
<script type=“text/wxtag-template”>
<style>.btn {width: 200px; height: 100px;}</style>
<button class=“btn”>打开测试小程序</button>
</script>
</wx-open-launch-weapp>
</div>
</div>
</template>
2、
onClickOpens() {
this.$axios({
method: “POST”,
url: “https://接口”,
data: {
url: window.location.href,
},
}).then(function (res) {
console.log(res);
if (res.status == 200) {
console.log(res.data.appid);
wx.config({
debug: true,
appId: res.data.appid,
timestamp: res.data.timestamp,
nonceStr: res.data.nonce_str,
signature: res.data.sign,
jsApiList: [“scanQRCode”],
openTagList: [“wx-open-launch-weapp”], // 可选,需要使用的开放标签列表,例如[‘wx-open-launch-weapp’]
});
wx.error(function (res) {
console.log(res);
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
});
}
});
},
3、
有没有试过把<button class=“btn”>打开测试小程序</button>这个地方换成动态数据,比如换成图片,图片地址是变量传入的,比如
<wx-open-launch-weapp id="launch-btn" username="gh_*" path="/pages/index/index.html"> <script type="text/wxtag-template"> <style>.img { width: 100%; height: 107.5px; }</style> <img :src="testImg" class="img"/> </script> </wx-open-launch-weapp>
你好,请问手机浏览器跳转打开小程序功能是怎么实现的呢?需要特殊配置吗?我的手机微信客户端现在能打开了,但是网页还是不行
大佬,config一直invalid signature,签名有问题,是啥原因。。。按照官方的测试工具返回的签名跟自己后端返回是一样的,按官方文档的顺序检查下来好像也没什么问题,是还有哪些小细节需要注意的吗?
请问在原生html中使用<wx-open-launch-app>后,按钮样式都不显示是什么原因啊
想问下,这个用ios/andriod项目中的webview加载打开,可跳转到小程序嘛?
大佬,直接打开h5可以显示跳转小程序按钮,现在把h5嵌入小程序,通过小程序分享出去的,跳转h5的按钮不显示了,是怎么回事
你这个直接在手机浏览器里可以实现打开小程序吗?
有一部分手机不显示按钮是什么原因
大佬们我这个行吗
小程序那边是不是直接在onload生命周期拿到参数,就是onLoad(options)的options是参数组成的对象呢?