首頁 > 軟體

小程式開發之雲函數的使用教學詳解

2022-03-24 10:00:50

1、雲函數

雲函數是部署在雲端的函數,他和小程式原生的函數存在很大的區別,雲函數應用涉及雲端雲函數定義和本地參照雲端雲函數的API介面兩個問題。

1.1 雲函數API和雲函數建立

1.1.1 小程式雲函數API介面

小程式雲函數API介面是指小程式呼叫雲端函數的介面,(和wx.request()類似)。小程式提供了wx.cloud.callFunction()介面作為雲函數API介面,它的屬性如表所示。

屬性型別預設值必填說明
namestring 雲函數名
dataObject 傳遞給雲函數的引數,在雲函數中可通過 event 引數獲取
configObject 設定
successFunction 返回雲函數呼叫的返回結果
failFunction 介面呼叫失敗的回撥函數
completeFunction 介面呼叫結束的回撥函數(呼叫成功、失敗都會執行)

官網範例程式碼:

假設已有一個雲函數 add:

exports.add = async (event, context, cb) => {
  return event.x + event.y
}

在小程式端發起對雲函數 add 的呼叫:

wx.cloud.callFunction({
  // 要呼叫的雲函數名稱
  name: 'add',
  // 傳遞給雲函數的event引數
  data: {
    x: 1,
    y: 2,
  }
}).then(res => {
  // output: res.result === 3
}).catch(err => {
  // handle error
})

1.1.2 雲函數的建立

建立雲函數的方法是右擊專案中的cloudfunctions資料夾,如下圖所示,選擇“新建Node.js雲函數”選項,開發者工具會自動生成一個資料夾,在文字方塊中輸入的資料夾即是雲函數名。

建立好之後的介面:

在建立好雲函數之後,即可根據自己的需要在main函數中編寫自己的程式碼。使用回車結束雲函數的建立還有一個好處是可以不用上傳和部署雲函數,系統會自動上傳和部署函數到雲端,即雲函數對應的資料夾圖示會自動變成雲朵摸樣。

2、雲函數案例

本例分別採用雲函數和本地函數實現加法操作和劍法操作,請對比區別。

firstcloudfunction.wxml:

<view class="data"><input placeholder="請輸入a" focus="true" bindinput="binda"></input></view>
<view class="data"><input placeholder="請輸入b" focus="true" bindinput="bindb"></input></view>
<view class="partition"></view>
<view class="arithmetic"><view bindtap='add'><button size="mini" class='bt' >+</button></view><view>{{add}}</view></view>
<view class="arithmetic"><view  bindtap='sub'><button size="mini" class='bt' >-</button></view><view>{{sub}}</view></view>

firstcloudfunction.js:

const app = getApp()
Page({
  data: {
    a:1,
    b:1,
   add:'',
   sub:''
  },

  onLoad: function() {
    
  },

binda:function(e){
 this.setData({
   a: e.detail.value
 })
    console.log(e.detail.value)
  },

  bindb: function (e) {
    this.setData({
      b: e.detail.value
    })
    console.log(e.detail.value)
  },

  add:function(e){
    var that=this;
    wx.cloud.callFunction({
      // 雲函數名稱
      name: 'add',
      // 傳給雲函數的引數
      data: {
        a: that.data.a,
        b: that.data.b,
      },
      success: function (res) {
        console.log(res.result.add) 
        var c = res.result.add
        that.setData({
          add: "a+b=" + c
        })
      },
      fail: console.error
    })
  },

  sub: function (e) {
    var c = Number(this.data.a) - Number(this.data.b)
    console.log(c)
    this.setData({
      sub: "a-b=" + c
    })
  }
})

程式碼講解:binda和bindb兩個點選函數從firstcloudfunction.wxml檔案中獲取使用者輸入的兩個運算元a和b,減法函數sub是普通的本地JavaScript函數,而加法函數add則採用了wx.cloud.callFunction()介面呼叫雲函數add。本例重點是雲函數的建立和部署。

雲函數add/index.js的程式碼如下:

exports.main = async (event, context) => {
return{add:Number(event.a)+Number(event.b)}
}

實現效果:

以上就是小程式開發之雲函數的使用教學詳解的詳細內容,更多關於小程式雲函數的資料請關注it145.com其它相關文章!


IT145.com E-mail:sddin#qq.com