效果图开发者工具与真机效果不同，真机为准
开发者工具效果图：

真机效果图：

1. 步骤一：获取模板 ID（前端同学的范围）

在微信公众平台手动配置获取模板 ID：
登录https://mp.weixin.qq.com获取模板，如果没有合适的模板，可以申请添加新模板，审核通过后可使用。

如图：

2.步骤二：获取下发权限（前端同学的范围）

一次性订阅消息、长期订阅消息，详见接口 wx.requestSubscribeMessage

设备订阅消息，详见接口 wx.requestSubscribeDeviceMessage

注意：
用户勾选 “总是保持以上选择，不再询问” 之后，下次订阅调用 wx.requestSubscribeMessage 不会弹窗，保持之前的选择，修改选择需要打开小程序设置进行修改。

3. 步骤三：调用接口下发订阅消息（后端同学的范围）

一次性订阅消息、长期订阅消息，详见服务端接口 subscribeMessage.send

设备订阅消息，详见服务端接口 hardwareDevice.send

4. 代码示例

html

<button bindtap="openPopup" class="openPopup">订阅消息</button>

js

  // 是否设置过授权
  openPopup() {
    const _this = this;
    // 获取用户的当前设置，判断是否点击了“总是保持以上，不在询问”
    wx.getSetting({
      withSubscriptions: true, // 是否获取用户订阅消息的订阅状态，默认false不返回
      success(res) {
        console.log('res.authSetting', res.authSetting)
        if (res.authSetting['scope.subscribeMessage']) {
          console.log('用户点击了“总是保持以上，不再询问”')
        } else {
          console.log('用户没有点击“总是保持以上，不再询问”则每次都会调起订阅消息')
          //因为没有选择总是保持，所以需要调起授权弹窗再次授权
          _this.authorizationBtn();
        }
      }
    })
  },

    // 授权
  authorizationBtn() {
    wx.requestSubscribeMessage({
      tmplIds: ['.....', '......'],
      success(res) {
        console.log('授权成功')
      }
    })
  },

如此即可。。。