微信小程序+springboot实习订阅消息

d906b927dd997144f36441cbacccccb.png

在我们开发微信小程序中经常会用到订阅消息提醒,如商城系统中,用户购买商品支付之后,可以发送提醒订单支付成功;在我们的拼团功能中,当拼团成功或失败时,可以推送订阅消息提醒用户;

一、订阅消息分为长期订阅和一次性订阅;

长期订阅消息:就是在用户授权之后,可以推送多次消息给用户;

一次性订阅消息:就是用户授权后只能推送一次消息给用户,如果还需要推送消息的话,就必须让用户再授权一次了;

两者比较起来的话肯定长期订阅消息用起来比较舒服的;但是它不是所有开发者都可以申请,一般是需要有一定的资质才行,如媒体类;具体的话,大家可以看官方文档的解释更为详细;

二、订阅消息模板

2.1、订阅消息模板申请

我们平时在微信的通知服务中可以看到一些别的小程序的通知,它提示的字段都是需要先去小程序后台中申请模板的;

在这里插入图片描述

2.2、根据自己的需要挑选模板,并选择所需字段

这里我选择了支付成功后的订阅消息模板

在这里插入图片描述

好了,挑选完模板后,我们开始进行开发;

三、小程序代码编写

3.1、小程序中创建一个页面,放入一个按钮,并绑定一个点击函数

xml:


<view class="intro">订阅功能Demo</view>

<view>

<button type="info" bindtap="submit">提交订单</button>

</view>

3.2、获取订阅权限,这里需要调用官方提供的API


wx.requestSubscribeMessage({

  tmplIds: [''],  //你的模板ID

  success (res) { }

})

3.3、js代码如下


const app = getApp()

Page({

  data: {

  },

  onLoad: function () {

  },

  submit(){

    wx.requestSubscribeMessage({

      tmplIds: ['你的模板Id'],

      success (res) {

        //发送请求到后端,后端接收到请求后调用订阅消息接口进行推送

      }

    })

  }

}) 

到这里我们可以测试效果了,点击按钮后会弹出授权框;要用真机调试才可以看到效果哦~
1dbfce765bcf52a0a5d803441cb51ab.png

四、编写后端代码

4.1、实现逻辑

4.1.1.前期需要有推送用户的openid

openId是用户在小程序中的唯一标识,也就是我们要推送给谁

4.1.2.我们需要先获取access_token;

access_token就类似一个临时身份证;我们需要传递appId和appSecret去官方提供的接口进行身份验证,如果你的appId和appSecret正确,就会传递一个access_token给你;这个token是有时效性的(7200s),也就是说7200s之后这个token就失效了,后面如果需要使用就需要重新获取

4.1.3.封装订阅消息模板内容

这里的封装格式需要注意一下;

例如,模板的内容为


姓名: {{name01.DATA}}

金额: {{amount01.DATA}}

行程: {{thing01.DATA}}

日期: {{date01.DATA}}

则我们要封装的数据格式应为


{

  "touser": "OPENID",

  "template_id": "TEMPLATE_ID",

  "page": "index",

  "data": {

      "name01": {

          "value": "某某"

      },

      "amount01": {

          "value": "¥100"

      },

      "thing01": {

          "value": "广州至北京"

      } ,

      "date01": {

          "value": "2018-01-01"

      }

  }

}

4.1.4.调用接口推送订阅消息

POST请求地址


https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=ACCESS_TOKEN

4.2、开发代码

4.2.1.导入HTTP请求工具,这里使用Hutool非常好用的Java开发SDK

官方文档地址:

https://www.hutool.cn/docs/#/

在pom.xml文件中引入maven包


        <dependency>

            <groupId>cn.hutool</groupId>

            <artifactId>hutool-all</artifactId>

            <version>5.4.0</version>

        </dependency>

4.2.2.获取access_token

    public String getAccessToken() {

        String appId = "你的openId";

        String appSecret = "你的小程序密钥";

        String result = cn.hutool.http.HttpUtil.get("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + appId + "&secret=" + appSecret);

        JSONObject jsonObject = JSONUtil.parseObj(result);

        return jsonObject.getStr("access_token");

    }

4.2.3.发送订阅消息

  @RequestMapping("/send")

    public String send(){

        JSONObject body=new JSONObject();

        body.set("touser","用户的openId");

        body.set("template_id","你的模板Id");

        JSONObject json=new JSONObject();

        json.set("thing6",new JSONObject().set("value","20200820757539"));

        json.set("date4",new JSONObject().set("value", LocalDateTime.now()));

        json.set("amount3",new JSONObject().set("value","多功能等一件商品"));

        json.set("character_string2",new JSONObject().set("value", DateUtil.now()));

        json.set("thing5",new JSONObject().set("value","拼团"));

        body.set("data",json);

        //发送

        String accessToken= getAccessToken();

        String post =  cn.hutool.http.HttpUtil.post("https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=" + accessToken, body.toString());

        return "ok";

    }

4.2.4.整合代码

package com.maomao.demo.controller;

import cn.hutool.core.date.DateUtil;

import cn.hutool.json.JSONObject;

import cn.hutool.json.JSONUtil;

import org.springframework.web.bind.annotation.RequestMapping;

import org.springframework.web.bind.annotation.RestController;

import java.time.LocalDateTime;

@RestController

@RequestMapping("/msg")

public class MessageController {

    public String getAccessToken() {

        String appId = "你的openId";

        String appSecret = "你的小程序密钥";

        String result = cn.hutool.http.HttpUtil.get("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=" + appId + "&secret=" + appSecret);

        JSONObject jsonObject = JSONUtil.parseObj(result);

        return jsonObject.getStr("access_token");

    }

    @RequestMapping("/send")

    public String send(){

        JSONObject body=new JSONObject();

        body.set("touser","用户的openId");

        body.set("template_id","你的模板Id");

        JSONObject json=new JSONObject();

        json.set("thing6",new JSONObject().set("value","20200820757539"));

        json.set("date4",new JSONObject().set("value", LocalDateTime.now()));

        json.set("amount3",new JSONObject().set("value","多功能等一件商品"));

        json.set("character_string2",new JSONObject().set("value", DateUtil.now()));

        json.set("thing5",new JSONObject().set("value","拼团"));

        body.set("data",json);

        //发送

        String accessToken= getAccessToken();

        String post =  cn.hutool.http.HttpUtil.post("https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=" + accessToken, body.toString());

        return "ok";

    }

}

五、小程序端调用

5.1、调用后端API接口


const app = getApp()

Page({

  data: {

  },

  onLoad: function () {

  },

  submit(){

    wx.requestSubscribeMessage({

      tmplIds: ['你的模板Id'],

      success (res) {

        //发送请求到后端,后端接收到请求后调用订阅消息接口进行推送

        wx.request({

          url: '你后端编写的推送api地址',

          method:"GET",

          data:{},

          success (res) {

            console.log(res.data)

          }

        })

      }

    })

  }

})

5.2、微信接收到订阅消息

d906b927dd997144f36441cbacccccb.png
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,732评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,496评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,264评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,807评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,806评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,675评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,029评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,683评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,704评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,666评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,773评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,413评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,016评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,204评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,083评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,503评论 2 343