微信小程序开发实现消息推送


Posted in Javascript onNovember 18, 2020

微信小程序的消息推送简单的说就是发送一条微信通知给用户,用户点开消息可以查看消息内容,可以链接进入到小程序的指定页面。

微信小程序消息推送需要用户触发动作才能发送消息,比如用户提交订单、支付成功。一次只能发一条,当然可以通过某种方法发送多条,小的就不在这里赘述了。下面就介绍一下如何推送消息。

一、准备工作

首先,在微信公众平台开通消息推送功能,并添加消息模板。可以从模板库选择模板也可以创建一个模板,模板添加之后,模板ID我们接下来要用的。

发送模板消息需要用到accesstoken、formId和openID。accesstoken获取及更新可以看我的上一篇文章;formID就是消息模板ID,openID我们最好在获取用户信息或用户登录时储存到全局变量里。

微信小程序开发实现消息推送

二、获取formID

在需要触发消息推送的页面添加提交表单的事件。目的是得到formID,formID是消息推送时必须的参数。

<form name='pushMsgFm' report-submit='true' bindsubmit='getFormID'> 
 <button form-type="submit" class="zan-btn zan-btn--large zan-btn--danger payButton">立即支付</button>
</form>

以上代码中“getFormID”是提交表单时触发的事件。

getFormID: function (e) {
this.setData({
formId: e.detail.formId }) }

以上方法是获取formId。

三、配置消息模板参数,并传给后台

var config = require('../config.js')
var app = getApp();
function pushMsg(formID, access_token){
 var openId = app.globalData.userInfo.openId;
 var messageDemo = {
 touser: openId,//openId
 template_id: 'PjtLeqq-UeF49r5jr88s27HBzBDobijr6QfiwJwIkPg',//模板消息id, 
 page: 'pages/index/index',//点击详情时跳转的主页
 form_id: formID,//formID
 data: {//下面的keyword*是设置的模板消息的关键词变量 
 
 "keyword1": {
 "value": "keyword1",
 "color": "#4a4a4a"
 },
 "keyword2": {
 "value": "keyword2",
 "color": "#9b9b9b"
 },
 "keyword3": {
 "value": "keyword3",
 "color": "red"
 }
 },
 color: 'red',//颜色
 emphasis_keyword: 'keyword3.DATA'//需要着重显示的关键词
 }
 wx.request({
 url: config.service.sendMsgUrl,
 data: { value: messageDemo, access_token: access_token},
 method: 'POST',
 success: function (res) {
 console.log("push msg");
 console.log(res);
 },
 fail: function (err) { 
 console.log("push err")
 console.log(err);
 }
 });
}
module.exports = { pushMsg: pushMsg }

四、推送消息

const request = require('../tools/ih_request');
var conf = require('../config.js')
module.exports = async (ctx, next) => {
 var body = ctx.request.body.value
await request.postJson({
 url: 'https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=' + ctx.request.body.access_token,
 body: body,
 success: function (res) {
 ctx.body = {
 result: res
 }
 console.log('res=',res);
 },
 error: function (err) {
 ctx.body = {
 result: err
 }
 console.log(err);
 }
});}

ih_request.js

const request = require('request');
var ih_request = {};
module.exports = ih_request;
ih_request.postJson = async function (option) {
 var res = await request({
 url: option.url,
 method: 'post',
 headers: {
 'content-type': 'application/json'
 },
 body: JSON.stringify(option.body),
 }, function (err, res, body) {
 res ? option.success(body) : option.error(res.msg);
 console.log('MSGresult=', body);
 });
}

为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中获取元素索引的函数
Sep 10 Javascript
jQuery 选择器项目实例分析及实现代码
Dec 28 Javascript
jquery判断浏览器后退时候弹出消息的方法
Aug 11 Javascript
15款jQuery分布引导插件分享
Feb 04 Javascript
简易的投票系统以及js刷票思路和方法
Apr 07 Javascript
【经典源码收藏】jQuery实用代码片段(筛选,搜索,样式,清除默认值,多选等)
Jun 07 Javascript
详解利用exif.js解决ios手机上传竖拍照片旋转90度问题
Nov 04 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
Nov 23 Javascript
关于react-router/react-router-dom v4 history不能访问问题的解决
Jan 08 Javascript
对vue中v-on绑定自定事件的实例讲解
Sep 06 Javascript
Vue中通过Vue.extend动态创建实例的方法
Aug 13 Javascript
JavaScript中10个Reduce常用场景技巧
Jun 21 Javascript
jQuery操作attr、prop、val()/text()/html()、class属性
May 23 #jQuery
js打开word文档预览操作示例【不是下载】
May 23 #Javascript
仿iPhone通讯录制作小程序自定义选择组件的实现
May 23 #Javascript
判断js数据类型的函数实例详解
May 23 #Javascript
JS定义函数的几种常用方法小结
May 23 #Javascript
vue-test-utils初使用详解
May 23 #Javascript
了解前端理论:rscss和rsjs
May 23 #Javascript
You might like
php学习之简单计算器实现代码
2011/06/09 PHP
PHP提取字符串中的图片地址[正则表达式]
2011/11/12 PHP
CentOS 6.3下安装PHP xcache扩展模块笔记
2014/09/10 PHP
PHP开发框架laravel安装与配置教程
2015/03/13 PHP
php获取文件类型和文件信息的方法
2015/07/10 PHP
PHP实现XML与数据格式进行转换类实例
2015/07/29 PHP
PHP内核探索之解释器的执行过程
2015/12/22 PHP
PHP递归获取目录内所有文件的实现方法
2016/11/01 PHP
跟着JQuery API学Jquery 之三 筛选
2010/04/09 Javascript
子窗口、父窗口和Silverlight之间的相互调用
2010/08/16 Javascript
jQuery实现单行文字间歇向上滚动源代码
2013/06/02 Javascript
编写js扩展方法判断一个数组中是否包含某个元素
2013/11/08 Javascript
jquery遍历之parent()和parents()的区别及parentsUntil()方法详解
2013/12/02 Javascript
node.js中的fs.chownSync方法使用说明
2014/12/16 Javascript
JavaScript获取当前cpu使用率的方法
2015/12/15 Javascript
AngularJS实现textarea记录只能输入规定数量的字符并显示
2016/04/26 Javascript
jquery插件uploadify多图上传功能实现代码
2016/08/12 Javascript
AngularJS入门教程之链接与图片模板详解
2016/08/19 Javascript
KnockoutJS 3.X API 第四章之表单submit、enable、disable绑定
2016/10/10 Javascript
微信小程序实现图片上传、删除和预览功能的方法
2017/12/18 Javascript
Node.js API详解之 tty功能与用法实例分析
2020/04/27 Javascript
使用Django和Python创建Json response的方法
2018/03/26 Python
在pycharm中创建django项目的示例代码
2020/05/28 Python
英国工作场所设备购买网站:Slingsby
2019/05/03 全球购物
宏碁西班牙官网:Acer西班牙
2021/01/08 全球购物
哥伦比亚加拿大官网:Columbia Sportswear Canada
2020/09/07 全球购物
凌阳科技股份有限公司C++程序员面试题笔试题
2014/11/20 面试题
数控专业推荐信范文
2013/12/02 职场文书
高考寄语大全
2014/04/08 职场文书
《蝙蝠和雷达》教学反思
2014/04/23 职场文书
反邪教标语
2014/06/23 职场文书
元旦趣味活动方案
2014/08/22 职场文书
行政答辩状范文
2015/05/21 职场文书
入党积极分子培养联系人意见
2015/08/12 职场文书
关于MySQL中的 like操作符详情
2021/11/17 MySQL
进行数据处理的6个 Python 代码块分享
2022/04/06 Python