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

文章目录

  • 微信小程序二
    • 小程序API
        • 基础:
        • 外部 api 的引用示例:
    • 订阅消息实战
        • 1. 搭配环境,建目录
        • 2. 获取openid
        • 3.获取用户授权
        • 4. 调用接口下发订阅消息
        • 5.其他问题:

微信小程序二

小程序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来接收接口调用结果

参数名 类型 必填 说明
success Function 接口调用成功的回调函数
fail Function 接口调用失败的回调函数
complete Function 接口调用结束的回调函数(调用成功、失败都会执行)

外部 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文件:


<text>pages/demo02/demo02.wxmltext>
<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中


在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. 定义按钮:

  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文件中

微信小程序----API、获取openid、消息订阅_第1张图片

//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
      }
}

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

微信小程序----API、获取openid、消息订阅_第2张图片

  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. 授权一次只能发送一次消息

你可能感兴趣的:(小程序,微信小程序,小程序,微信)