1、开通订阅通知
根据api开通 https://developers.weixin.qq.com/doc/offiaccount/Subscription_Messages/intro.html
2、设置订阅通知组件
根据api设置服务号订阅通知按钮
参考微信订阅消息接入 使用开放标签 在 H5网页设置订阅通知组件
3、通知
根据api设置send发送订阅通知
4、坑
4.1、错误代码:43101, 错误信息:user refuse to accept the msg rid: 636e06c6-372a03a5-52793c6d,微信原始报文:{"errcode":43101,"errmsg":"user refuse to accept the msg rid: 636e06c6-372a03a5-52793c6d"}
43101 用户拒绝接受消息,如果用户之前曾经订阅过,则表示用户取消了订阅关系
需要注意先设置订阅通知组件,api中步骤四:可以在图文消息、网页设置订阅通知组件已说明
代码部分
html
<wx-open-subscribe template="" id="subscribe-btn" appid="appid" >
<script type="text/wxtag-template" slot="style">
<style>
.subscribe-btn {
border-radius: 3px;
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
background-color: #21b9bb;
border-color: #21b9bb;
color: #fff;
display: inline-block;
margin-bottom: 0;
font-weight: 400;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
}
</style>
</script>
<script type="text/wxtag-template">
<button class="subscribe-btn">
一次性模版消息订阅
</button>
</script>
</wx-open-subscribe>
html对应js
<script>
wx.config({
debug: false,
appId: data.appId,
timestamp: data.timestamp,
nonceStr: data.nonceStr,
signature: data.signature,
jsApiList: ["必填", ], // 必填,需要使用的JS接口列表
openTagList: ["wx-open-subscribe"] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']
});
var btn = document.getElementById('subscribe-btn');
btn.addEventListener('success', function (e) {
layer.msg('订阅成功');
alert('订阅按钮调用成功');
});
btn.addEventListener('error',function (e) {
alert('订阅按钮调用失败');
})
</script>