需求:微信浏览器内打开app分享的文章,要出现“用app打开”的按钮,点击即跳到自己的APP,并根据参数执行相应的操作。
下面开始踩坑之旅行:
首先需要有一个微信公众号(类型必须是服务号,订阅号不行,解决办法:再注册一个服务号)
注册并审核通过后,进入https://open.weixin.qq.com/
微信官方示例代码:
https://www.weixinsxy.com/jss...
备注:链接中包含php、java、nodejs以及 python 的示例代码供第三方参考,第三方切记要对获取的 accesstoken 以及jsapi_ticket进行缓存以确保不会触发频率限制
我的案例:
<?php
require_once "jssdk.php"; //从下载的官方示例代码获取
// 注意,由于curl版本的不同,上面这个jssdk.php的某一句要改一下:
//原句curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);
//改成curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, 2);否则可能不工作
//注意:这里要填公众服务号的appID以及appSecret
//在https://mp.weixin.qq.com/ 功能设置、基本配置-公众号开发信息中获取
$jssdk = new JSSDK("wxxxxxxxbb5", "xxxxxxxxxxx");
$signPackage = $jssdk->GetSignPackage();
?>
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
wx.config({
debug: false,
appId: '<?php echo $signPackage["appId"];?>',
timestamp: <?php echo $signPackage["timestamp"];?>,
nonceStr: '<?php echo $signPackage["nonceStr"];?>',
signature: '<?php echo $signPackage["signature"];?>',
jsApiList: [
// 所有要调用的 API 都要加到这个列表中
//我没用到 所以留空
],
openTagList: ['wx-open-launch-app']
});
wx.ready(function () {
// 在这里调用 API 可留空
});
</script>
<!--注意:wx-open-launch-app标签里的appid是所需跳转到的你的移动应用的appid,不是公众号服务号的-->
<wx-open-launch-app style="position:fixed; z-index: 999; top:10em; right:3px; " id="launch-btn" appid="wxxxxxxxxxx52" extinfo="works_id=<?php echo $works_id ?>">
<script type="text/wxtag-template">
<style>.btn {width:100%; height:1.5em; padding: 3px; border-radius: 0.6em; color:#fff; background: #dc143c; }</style>
<div class="btn">在App内打开</div>
</script>
</wx-open-launch-app>
<script>
var btn = document.getElementById('launch-btn');
btn.addEventListener('launch', function (e) {
console.log('success');
});
btn.addEventListener('error', function (e) {
console.log('fail', e.detail);
});
</script>
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。