- 小程序消息推送,订阅消息的实现,借助云开发云函数实现定时推送订阅消息功能
我在云开发基础课程里给大家讲过小程序消息推送功能的实现,等下会给大家回顾下。但是有时候我们如果想实现定时推送的功能该怎么做呢 一,普通订阅消息的发送 我们先来看下订阅消息的官方简介。 [图片] 接下来我们就来借助云开发,来快速实现小程序消息推送的功能。 1-1,获取模板 ID 这一步和我们之前的模板消息推送是一样的,也是先添加模板,然后拿到模板id [图片] 首先是开通订阅消息功能,很简单,如下图 [图片] [图片] 由于长期性订阅消息,目前仅向政务民生、医疗、交通、金融、教育等线下公共服务开放,后期将逐步支持到其他线下公共服务业务。仅就线下公共服务这一点,长期性订阅消息就和大部分开发者无缘了。 所以我们这里只能以使用一次性订阅消息为例。 [图片] 如上图,我们从公共模板库里选择一个一次性订阅的模板。然后编辑模板如下图 [图片] 下图就是我们添加好的模板,下图的模板id就是我们需要的。 [图片] 1-2,请求用户授权 我们做订阅消息授权时,只能是用户点击或者支付完成后才可以调起来授权弹窗,官方是这么要求的: [图片] 我们这里用到了wx.requestSubscribeMessage这个方法,来获取用户的授权。 1,编写index.wxml代码 [图片] 2,编写index.js代码,实现点击获取授权 [图片] 这一步tmplIds里的一串字符,就是我们自己添加的模板id [图片] 3,点击按钮运行效果如下 开发者工具模拟器上点击授权弹窗是这样的: [图片] 手机上的授权弹窗是这样的: [图片] 可以看到,这里显示的就是我们添加的 ‘上课提醒’的模板。 细心的同学可以看到, 真机上多了一个 ‘总是保持以上选择,不再询问’ 其实,你自己仔细多品一些。也能明白,我们正常订阅消息授权时,用户允许的话,你只能推送一次消息。也就是用户允许一次,我们就可以推送一条消息给用户,并且这个允许不存在过期。所以我们可以让用户尽量多的点击允许,这样我们就可以尽量多的给用户发送消息了。 这里用户允许后,我们就可以给用户推送消息了,接下来我们来借助云开发的云函数来实现消息推送功能。 1-3,获取用户的opneid 先来看官方爸爸是怎么说的。 [图片] 可以看出官方提供了两种方式,我们这里使用云调用。说白了就是在云函数里调用推送功能。 推送所需参数 [图片] 可以看到我这里用来openapi功能,并且需要用到用户的opneid,关于openid的获取,我之前有写过文章,也录过视频的。文章的话,大家去翻下我历史的文章,视频的话,点击这个即可:《借助云函数获取用户openid》 这里的openid的获取我就不再详细讲解了,把对应云函数的代码给大家贴出来。 [图片] 在使用云开发时,有几点需要注意的 1,需要在project.config.json里创建云函数目录如下图 [图片] 2,需要在app.js里初始化云开发环境 [图片] 至于云开发的环境id从哪里拿,我视频里也讲过很多遍了,直接去看我视频或者翻看我历史文章即可。 《零基础入门云开发视频》 1-4,用云函数实现消息推送 我们只需要创建一个云函数如下,然后填入用户的openid,要跳转的小程序页面链接,模板内容,模板id即可。通常这些数据都应该传进来,简单起见,我就把这里的模板内容写成固定的。 [图片] 注意:我在编写上面的代码时,推送内容的key必须和小程序模板里的key保持一致,否则就会报如下错误。 [图片] 然后看下调用这个云函数的地方 [图片] 如果用户没有授权,我们推送会报如下错误 [图片] 如果用户授权过,我们就可以成功推送了,推送后的打印日志如下 [图片] 还记得我们真机上的授权吗,如果用户只是点击了允许,没有选择一直允许,那我我们在推送成功一次后,如果再次推送,就需要用户重新授权。否则,还是会报这个错误的 [图片] 所以我们用户点击一次允许,我们就可以推送一次消息,比如,我点击了4次允许那么我就可以成功的推送4次 [图片] 效果图 [图片] 可以看到,我们成功的收到 上课提醒的模板消息,点击进去,就是我们具体的推送内容 [图片] 其实我这是连续收到了4条消息,因为我点击了4次允许推送,所以就可以成功的推送4次。 到这里我们就完整的实现模板消息推送功能了,下面我把主要代码贴给大家,大家也可以私信我获取完整源码。 index.wxml [代码]<button bindtap="shouquan" type='primary'>获取订阅消息授权</button> <button bindtap="getOpenid">获取用户的openid并推送消息</button> [代码] index.js [代码]//编程小石头wechat:2501902696 Page({ //获取授权的点击事件 shouquan() { wx.requestSubscribeMessage({ tmplIds: ['CFeSWarQLMPyPjwmiy6AV4eB-IZcipu48V8bFLkBzTU'], //这里填入我们生成的模板id success(res) { console.log('授权成功', res) }, fail(res) { console.log('授权失败', res) } }) }, //获取用户的openid getOpenid() { wx.cloud.callFunction({ name: "getopenid" }).then(res => { let openid = res.result.openid console.log("获取openid成功", openid) this.send(openid) }).catch(res => { console.log("获取openid失败", res) }) }, //发送模板消息到指定用户,推送之前要先获取用户的openid send(openid) { wx.cloud.callFunction({ name: "sendMsg", data: { openid: openid } }).then(res => { console.log("推送消息成功", res) }).catch(res => { console.log("推送消息失败", res) }) } }) [代码] 推送对应的云函数 [代码]//编程小石头wechat:2501902696 const cloud = require('wx-server-sdk') cloud.init() exports.main = async(event, context) => { try { const result = await cloud.openapi.subscribeMessage.send({ touser: event.openid, //要推送给那个用户 page: 'pages/index/index', //要跳转到那个小程序页面 data: {//推送的内容 thing1: { value: '小程序入门课程' }, thing6: { value: '杭州浙江大学' }, thing7: { value: '第一章第一节' } }, templateId: 'CFeSWarQLMPyPjwmiy6AV4eB-IZcipu48V8bFLkBzTU' //模板id }) console.log(result) return result } catch (err) { console.log(err) return err } } [代码] 后面我会分享更多小程序相关的知识出来,请持续关注。 注意:授权一次,只能发送一条消息。 二,定时发送消息 我们上面用户授权和发送消息都需要手动点击才可以实现发送。但是有时候我们需要定时提醒用户,比如做的闹钟小程序,要定时提醒用户,该怎么做呢,接下来我们就来实现定时发送消息的功能。 注意 当然了这里还是要先授权才可以发送消息的,同样也是授权一次可以发送一条消息,所以这里要尽量先多授权几次 2-1,什么是定时触发器 我们实现定时发送的功能就是要用到云函数里的定时触发器,官方介绍如下。 [图片] 大家有时间可以自己去仔细读下 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/triggers.html [图片] 官方已经教我们怎么写定时触发器了 2-2,定时触发器时间设置规则 建议大家仔细去读下官方文档。 [图片] 下面是官方给出的一些示例 [图片] 我这里就取用每隔5秒通过该定时触发器调用下我们的云函数,实现订阅消息的发送。 2-3,添加定时触发器 添加步骤如下图,我们需要新建一个云函数timer [图片] 我们要在timer云函数里调用我们的fasong云函数来实现发送功能 [图片] 然后在timer文件夹下新建一个config.json文件 [图片] [图片] 然后给config.json做如下配置 [图片] 注意json里不能有注释,配置好的触发器如下 [图片] 2-4,部署定时触发器 添加好以后,记得部署触发器 [图片] 2-5,定时发送效果 首先看定时触发器是不是每隔5秒执行了一次 [图片] 然后看手机是否接到了消息 [图片] 可以看出我们手机上每隔5秒也接到了消息。这里还是要记得多授权才可以多接消息。 当然了,我们不可能这样每隔5秒给客户发条消息,这样骚扰到客户,很容易被封的,所以可以停止触发器 2-6,停止触发器 [图片] 到这里我们的定时发送消息功能也实现了,当然了我们要发给指定用户,就要先去获取用户openid,并且得让用户多授权。
2022-02-28 - 【面向公告编程】带你深入分析适配 wx.getUserProfile 以及如何兼容 wx.getUserInfo
前言 由于一些开发者的滥用,为了优化用户体验,微信官方在获取用户信息上,提供了新的API「wx.getUserProfile」,接下来作者将带你解读官方公告(传送门: 小程序登录、用户信息相关接口调整说明),进一步提升“面向公告编程”能力。 常见问题 1、线上版本是不是一定要接入新的 API 才能正常使用? 并不是哦,如果你的小程序是在 2021 年 4 月 13 日后发布的才需要接入,此前发布的线上版本仍不受影响。 2、wx.getUserProfile 从 2.10.4 基础库开始支持,那么 2.10.4 以下基础库不就使用不了这个 API 了吗? 并不是哦,2.10.4 以下基础库仍然可以通过调用原有 API「wx.getUserInfo」获取用户信息及进行解密。 3、为什么开发版和体验版调用 wx.getUserInfo 都不返回用户信息了? wx.getUserInfo 开发版和体验版已对齐匿名表现(返回如下图结果),因此开发者可在 2021 年 4 月 13 日前在开发版或者体验版中,适配新的登录授权流程。 [图片] 4、wx.getSetting 无法获取用户信息的授权(即 scope.userInfo )? 从 2021 年 4 月 13 日开始,无论是通过 wx.authorize 请求授权还是 wx.getSetting 获取授权状态,都将直接返回 true。【PS:由于 wx.getUserProfile 每次调用时都需要用户弹窗授权,因此将无法获取用户授权状态】 [图片] 5、wx.getUserProfile 为什么只能获取到 userInfo 信息,却获取不到 rawData、signature、encryptedData、iv 等信息呢? 据悉,这几天会灰度 2.10.4 ~ 2.16.0 之间支持获取 rawData、signature、encryptedData、iv 等加密信息,具体以官方通知 / 文档为准 新的 API 对基础库有一定的要求,除了参数 userInfo 的值需要 2.10.4 及以上基础库支持获取之外,其它参数也需要 2.16.0 及以上基础库才支持获取。【PS:目前基础库在 2.10.4 ~ 2.16.0 之间将无法获取 rawData、signature、encryptedData、iv 等信息,具体以官方通知为准】 [图片] 6、PC 端微信暂不支持新的 API「wx.getUserProfile」应该怎么处理? 可以通过以下方式兼容。【PS:暂不推荐使用 wx.canIUse(“getUserProfile”) 做兼容判断,后续可使用该方式进行判断】 [代码]if (wx.getUserProfile) { console.log("支持 wx.getUserProfile") } else { console.log("不支持 wx.getUserProfile") } [代码] 7、开发者工具或真机提示 wx.getUserProfile is not a function 错误信息,应该怎么处理? ① 确认开发者工具为 1.05.2103022 及以上版本,并且调试基础库为 2.10.4 及以上。 ② 确认手机微信为 7.0.9 以上版本,且基础库为 2.10.4 及以上。 ③ 如果工具内基础库已设置为 2.10.4 及以上,仍报同样的错误信息,可尝试调高工具基础库直至支持此 API 【PS:一切以真机为准!】 8、wx.getUserProfile 获取 encryptedData 及 iv 参数后进行解密,无法获取到 openid 等信息? 原来调用 wx.getUserInfo 后进行解密可以获取到 openId 等信息如图 1 所示,但是新的 wx.getUserProfile 将无法直接获取到此类用户标识,返回的信息如图 2 所示。 [图片] 9、解密用户信息将不会返回 openId 及 unionId 这类信息,应该怎么解决处理? 新的登录流程有变化!开发者通过 wx.login 获取到用户登录凭证 (code),调用微信登录接口(auth.code2Session)将直接返回 openId、unionId(请先确认已在开放平台绑定该小程序,绑定流程:登录 微信开放平台 — 管理中心 — 小程序 — 绑定小程序) 10、wx.getUserProfile 跟 wx.login 无法同时调用,报 getUserProfile:fail can only be invoked by user TAP gesture 错误信息? 请勿在 wx.login 的 success 回调中调用 wx.getUserProfile。 解决方式: 先使用 [代码]checkSession[代码] 进行登录态检查;提前调用 [代码]wx.login[代码] 再调用 [代码]wx.getUserProfile[代码],完成授权登录流程。 先拖更 据悉:wx.getUserProfile 计划从基础库版本 2.6.6 开始支持 有疑问欢迎在下方留言或者发社区私信
2022-02-15 - 微信小程序发送一次性订阅消息是不是太鸡肋了?
我是一所本科在校学生,打算做一个学校食堂点餐,超市购物配送,校园快递查询的微信小程序 在这一周的学习和项目分析中。发现这个微信小程序需要发送订单消息。学生下单发送给超市店家,学生点餐发送给食堂等场景。现在用微信小程序提供的一次性订阅消息的话需要超市店家和食堂工作人员每次都点授权按钮(需要授权发送订阅消息,一次授权只能发一条,连续授权最多储存三条发送消息的权限,之后就要重新授权 = = ),这样对于超市和食堂工作人员来说根本没有用啊。在中午晚上高人流量的时候,总不可能雇一个人一直在那授权吧。我是个人又不能申请长期订阅,@微信小程序官方客服,请求帮助。
2020-04-08 - 小程序中的一次性订阅和长期订阅有什么区别?
请问一次性订阅和长期订阅有什么区别?
2020-04-20 - 使用云开发CMS能力实现简易商场
源码 点此领取 技术栈 云开发 CloudBase:云端一体化的 Serverless 后端服务解决方案。Taro:一套遵循 React 语法规范的 多端开发 解决方案开发工具 建议提前安装好 微信开发者工具Node LTS 版本VS Code 编辑器CloudBase VS Code 插件需求分析 只考虑基本的功能: 商品列表与下单:展示商品信息,创建订单订单列表:展示订单列表 资源准备 1. 在微信开发者工具中开通云开发,请选择按量付费 如果你的环境是预付费,请到设置中,将支付方式转换为按量付费 [图片] 2. 安装 CMS 系统 (1)更新到最新的 Nightly 版本工具,在工具顶部 Tab 栏中,点击「更多」-「内容管理」。 [图片] (2)点击开通,勾选同意协议后,点击确定。 [图片] (3)开通内容管理需要填写管理员账号,填写账号后,点击「确定」完成。 [图片] (4)开通拓展需要一定时间,请耐心等待。 (5)完成后,点击「更多」-「内容管理」,即可看到内容管理的入口和相关信息。点击访问地址,即可在弹出的窗口中进行内容管理的相关配置。 [图片] 3. 登录 CMS 系统,创建资源 CloudBase CMS 已经部署在当前环境下的静态网站托管中,访问地址的格式如下:云开发静态托管默认域名/部署路径,例如 https://envid.ap-shanghai.app.tcloudbase.com/tcb-cms/(结尾有 / 符号)。默认域名可以访问控制台查看。 打开 CloudBase CMS 后,你需要先登录,账号密码为安装时设置的管理员账号和密码。 在开始管理内容数据前,我们需要先创建一个项目。CloudBase CMS 使用项目划分不同类的内容,便于区分内容数据用途,进行权限管理。 首先,我们需要点击新建项目下方的创建新项目按钮,创建一个名为小商店,Id 为 shop 的项目。 [图片] 创建完项目后,点击项目卡片,进入项目的管理页面,我们会看到项目的欢迎页面。 [图片] 创建商品类型,管理商品信息 创建一个名称为商品的内容模型,数据库名为 goods,即将商品数据存储到 goods 数据集合中。如果新建内容的时候指定的集合不存在,CloudBase CMS 会自动新建集合。 [图片] 在创建完内容模型后,我们会得到一个空的内容模型。接下来,我们需要为商品添加商品名称,商品图片,价格,库存数量等字段。 为商品添加商品名称属性,因为商品名称通常是比较短的文字,所以我们可以选择单行字符串字段,点击右侧的单行字符串卡片,填写商品名称的字段信息。除了基本的名称,数据库字段名之外,我们还可以为此字段添加其他的限制,如最大长度,限制填写商品名称时的最大长度,创建商品时,是否必需填写商品等。 [图片] 类似的,我们可以创建数字类型的价格字段以及库存数量,图片类型的商品图片字段。在创建图片字段时,考虑到商品的图片可能有多张,我们可以打开允许多个内容按钮,表明可以上传多张图片。 [图片] 创建的 goods 数据库集合的结构如下: [图片] 同上,类似的创建一个名称为订单列表,数据库集合名为 order 的内容模型,来管理订单信息。创建的 order 数据库集合的结构如下: [图片] 添加一个商品 [图片] 创建项目 1、拉取模板 # 安装 taro cli 工具 npm install -g @tarojs/cli@2.2.7 # 拉取模板 git clone https://github.com/TencentCloudBase/cloudbase-minishop.git 使用微信开发者工具导入项目,进入 client 目录,安装依赖: npm i 项目目录 cloud/functions 包含写好的微信支付的两个云函数, pay 和接收支付消息推送的 pay-callback 云函数。使用时需使用微信开发者工具上传这两个云函数。 2、项目目录 . ├── client // 小程序源码 │ ├── config │ └── src │ ├── assets │ ├── components │ └── pages │ ├── index │ └── order-list └── cloud // 云开发相关源码 │ └── functions │ ├── pay │ └── pay-callback ├── cloudbaserc.json // 云开发配置 ├── project.config.json // 小程序配置 微信支付下单流程 1、小程序调用云函数,在云函数中调用统一下单接口,参数中带上接收异步支付结果的云函数名和其所在云环境 Id。 const cloud = require("wx-server-sdk"); const res = await cloud.cloudPay.unifiedOrder({ envId: '', subMchId: '', body: "商品名", totalFee: 100, outTradeNo: '订单号', spbillCreateIp: "127.0.0.1", functionName: "pay-callback" }); // 返回 res.payment 支付结果回调的云函数必须返回如下一个对象,否则会视为回调不成功,云函数会收到重复的支付回调。 { errcode: '', errmsg: '', } 2、统一下单接口返回的成功结果对象中有 payment 字段,该字段即是小程序端发起支付的接口(wx.requestPayment)所需的所有信息。 3、小程序端拿到云函数结果,调用 wx.requestPayemnt 发起支付 wx.requestPayment({ ...payment, success (res) { }, fail (res) { }tt })https://docs.cloudbase.net/ 4、支付完成后,在统一下单接口中配置的云函数将收到支付结果通知。 多端支持 - 跨平台 小程序Web 相关文献 云开发文档 云开发微信支付 支付接口
2021-09-10