微信小程序----API、获取openid、消息订阅

微信小程序二

小程序API

https://www.w3xue.com/mobile/wxminiapp/hpm41q8p.html

基础:

API,全称Application Programming Interface,即应用程序编程接口。

  • API 是一些预先定义函数,目的是用来提供应用程序与开发人员基于某软件或者某硬件得以访问一组例程的能力,并且无需访问源码或无需理解内部工作机制细节。

  • API 就是操作系统给应用程序的调用接口,应用程序通过调用操作系统的 API而使操作系统去执行应用程序的命令(动作)。在 Windows 中,系统API是以函数调用的方式提供的。

说明:

  • wx.on 开头的 API 是监听某个事件发生的API接口

    如:接受一个CALLBACK函数作为参数,当该事件触发时,会调用CALLBACK函数。

  • 如未特殊约定,其他API接口都接受一个OBJECT作为参数。

  • OBJECT中可以指定success,fail,complete来接收接口调用结果

参数名类型必填说明
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)
外部 api 的引用示例:

js文件:

// pages/demo02/demo02.js
const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    code:'',
    testList:[],
    dreamCode:'',
    dreamResult:[]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    self=this;
  },
  test1:function() {
    //访问外部api需请求:
      wx.request({
        url: 'http://api.tianapi.com/starinfo/index',
        method:'GET',
        //请求参数:
        data:{
          key:'9b46f4069f578a5808847c85ce6b93eb',
          name:'刘德华'
        },
        //接口调用成功的回调函数:
        success:function(res){
            console.log(res.data);
            self.setData({
              testList:res.data.code,
              testList:res.data.newslist
            })
          }
      })
  },
  test2:function() {
    wx.request({
      url: 'http://api.tianapi.com/dream/index',
      method:'GET',
      data:{
        key:'9b46f4069f578a5808847c85ce6b93eb',
        num:5,
        word:'西瓜'
      },  
      success: function(res) {
        console.log(res.data)
         //页面获得数据
        /*self.setData({
            dreamCode:res.data.code,
            dreamResult: res.data.newslist
        })*/
      }   
    })
  }
})

wxml文件:

<!--pages/demo02/demo02.wxml-->
<text>pages/demo02/demo02.wxml</text>
<button open-type="share" bindtap="test2">周公解梦</button>-
<view wx:for="{{dreamResult}}" >
    <view>梦到{{dreamResult[index].title}}------{{dreamResult[index].result}}</view>
</view>

<button type="primary" bindtap="test1">明星百科大全</button>
<view wx:for="{{testList}}" >
  <view>名字:{{testList[index].nationality}}</view> 
</view> 

订阅消息实战

1. 搭配环境,建目录

注意:创建项目时先不要使用云开发,避免不必要的目录

  1. 在app.js文件中初始云环境

     onLaunch() {
          wx.cloud.init({
              env:"cloud1-0gdcaicsce323e0e"
          })
     },
    
  2. 在project.config.json文件中,创建云函数

    "cloudfunctionRoot": "cloud1/",
    

    在目录处新建文件夹命名(出现小云朵成功)

    右键选自己的一个环境,如果只有一个环境的话,就是当前环境。

  3. 创建云函数,右键cloud1(自己的那个云函数目录),选择—>新建Node.js云函数,创建云函数(先获得openid),此文件中的inde.js的 cloud.init() 中初始化,可以用常量cloud.DYNAMIC_CURRENT_ENV

    cloud.init({
        env:cloud.DYNAMIC_CURRENT_NV  //默认取当前云环境ID
    })
    
2. 获取openid

在pages目录的-----index.wxml中

<button bindtap="getOpenid">获取用户openID</button>

在pages目录的-----index.js的代码中

Page({
 //获取用户openID
 getOpenid(){
     wx.cloud.callFunction({
         name:"getOpenid"
     }).then(res=>{
        console.log("获取Openid成功",res)
     }).catch(res=>{
        console.log("获取Openid失败",res)
     })
 }
})

保存后需要再次上传并部署,内容修改就得部署一次

3.获取用户授权

每次订阅消息的时候都需要获取授权

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

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

  1. 定义按钮:
<button bindtap="shouquan" >2.获取用户授权</button>
  1. 授权,绑定模板ID

    //pages目录的-----index.js的Page({})中
    shouquan(){
        wx.requestSubscribeMessage({
            tmplIds: [
                '3PlhCeepxyLBh7SziJ_BCc3Eyg5GOy313bJYATK3EHA'
            ], //此处添加申请的模板ID,多个用英文逗号隔开
            success(res){
              console.log('授权成功-----',res)
            },
            fail(res){
              console.log('授权失败-----',res)
            }
          })
     }
    

【当有多个模板的时候可以通过真机调试,手机进行模板的选择—>

真机调试–>手机扫码(模拟器与手机同步)—>点击获取授权,选择模板】

4. 调用接口下发订阅消息

新建云函数 (getMessages) 初始化步骤同上---->略

  1. getMessages下的index.js文件中

//getMessages下的index.js文件中
// 云函数入口函数
exports.main = async (event, context) => {
    try{
        //发送订阅消息给用户
        const result = await cloud.openapi.subscribeMessage.send({
          touser:event.openid,	//获取当前环境的openid
          page:"pages/index/index",  //要跳转到哪个页面
          data:{  //推送的内容
            thing1:{
              value:"小程序编程"
            },
            name2:{
              value:'Aurora'
            },
            date3:{
              value:'2022/09/15 14:00'
            },
            thing4:{
                value:'大教室01'
              }
          },
          //模板id
          templateId:'3PlhCeepxyLBh7SziJ_BCc3Eyg5GOy313bJYATK3EHA'  //与前面模板ID相同
        })
        console.log(result)
        return result.errcode
      }catch(err){
        console.log(err);
        return err
      }
}

申请的模板,点击详情中的部分与代码中的名称相对应

在这里插入图片描述

  1. 在pages目录的-----index.js和index.wxml中

    按钮:3.发送订阅消息给单个用户

     //发送消息给单个用户
     sendOne(){
         wx.cloud.callFunction({
            name:"sendMessages"
         }).then(res=>{
            console.log("发送一条信息成功-----",res)
         }).catch(res=>{
            console.log("发送一条信息失败~~~",res)
         })
     }
    

【此时运行整个过程,控制台全部成功,但是手机并不能获取到信息】

解决:

openid没有上传

在pages目录的index.js中添加传入openid

sendOne(){
     wx.cloud.callFunction({
        name:"sendMessages",
        data:{
            //此处openid与touser:event.openid的相同,将第一步获取的openid复制
            openid:"oMKZh4zYY0j7X-DYLAQa2ngdlpfg"   
        }      
     }).then(res=>{
        console.log("发送一条信息成功-----",res)
     }).catch(res=>{
        console.log("发送一条信息失败-----",res)
     })
 }
5.其他问题:
  1. 模板ID中的参数名莫错,模板ID莫复制错

  2. 手机未收到消息去控制台找错来源:

![[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

errMsg会出现40003(openid有误)等等的错误,可以去官方文档的社区中,将错误信息或者错误代码复制,看他人如何解决或者官方文档提示的错误

  1. 授权一次只能发送一次消息
  • 2
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

朱尔斯Jules

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值