云開發(fā)是微信平臺新開放的功能,為開發(fā)者提供集成了服務(wù)器,數(shù)據(jù)庫和資源存儲的云服務(wù)。本文將基于官方文檔,以一個小例子來作為探索云開發(fā)的相關(guān)功能。
一、新建云開發(fā)項(xiàng)目新建項(xiàng)目
將微信開發(fā)助手更新之后,選擇云開發(fā)模板。
項(xiàng)目目錄
項(xiàng)目目錄分為了2大塊內(nèi)容:cloudfunctions(云函數(shù))和miniprogram。miniprogram存放的是和普通開發(fā)相同的業(yè)務(wù)代碼和資源,cloudfunctions中則存放了可以上傳至云端的代碼,在云開發(fā)中被稱為云函數(shù)。
云開發(fā)模板建立之后,會帶有一些相關(guān)例子可以熟悉api。
二、控制臺
微信開發(fā)者工具更新之后,在工具欄上會有一個控制臺入口,點(diǎn)擊可出現(xiàn)以下面板,可查看相關(guān)數(shù)據(jù)情況。
概覽
概覽界面如上圖所示,展示了該 云開發(fā)項(xiàng)目下使用云資源的統(tǒng)計(jì)數(shù)據(jù)。
用戶管理
凡是訪問過云項(xiàng)目的用戶,都會在用戶管理下留有訪問記錄。前提是該小程序在app.js
中設(shè)置traceUser:true
,表示允許記錄用戶信息。
wx.cloud.init({ env:'......', traceUser: true, })
數(shù)據(jù)庫
數(shù)據(jù)庫是控制臺中最常用的功能之一,在該界面下,可以快速建立數(shù)據(jù)集合,可以理解為數(shù)據(jù)表。可在控制臺中建立新的集合,添加記錄有三種方式:控制臺手動添加、文件導(dǎo)入以及調(diào)用api。調(diào)用api會在每條記錄中自動插入用戶_openid。
存儲管理
存儲管理可保存小程序端上傳的文件,可通過調(diào)用api進(jìn)行上傳,上傳名稱和路徑需要自己定義。
云函數(shù)
云函數(shù)對cloudfunctions中上傳的函數(shù)進(jìn)行管理,可進(jìn)行調(diào)試,查看調(diào)用日志等信息。
云函數(shù)添加方式有2種,可視化添加與IDE添加,可視化添加的云函數(shù)直接上傳至了云端,IDE中添加需要上傳部署才可以調(diào)用。如果要刪除云函數(shù),在控制臺刪除之后,IDE中同步云函數(shù)列表即可。
統(tǒng)計(jì)分析
統(tǒng)計(jì)分析對云服務(wù)的調(diào)用情況有針對得給出了數(shù)據(jù)。
三、環(huán)境配置
api會在每條記錄中自動插入用戶_openid。
項(xiàng)目初始化需要在app.js
中進(jìn)行配置,env
中填寫的就是自主配置的環(huán)境ID。
wx.cloud.init({ env:'mina-cloud-test001' })
四、實(shí)際應(yīng)用
本例以上傳書籍信息為實(shí)際應(yīng)用,實(shí)現(xiàn)基本的書籍信息增刪改查功能,以及圖片的上傳刪除。
讀取數(shù)據(jù)庫數(shù)據(jù)
先通過調(diào)用wx.cloud.database();獲取數(shù)據(jù)庫所有集合,然后通過查詢具體集合的方式獲取數(shù)據(jù)。
const db = wx.cloud.database(); const _ = db.command; db.collection('bookList').get().then(res => { console.log('get', res) self.setData({ bookList: res.data }); })
增加數(shù)據(jù)
const db = wx.cloud.database(); const _ = db.command; db.collection('bookList').add({ data: { bookMes: self.data.bookMes } }).then(res => { console.log(res) })
刪除數(shù)據(jù)
db.collection('bookList').doc(id).remove().then(res => { console.log(res) wx.showToast({ title: '刪除成功!', }) self.getBook(); }).catch(err => { console.log('err', res) }) })
增加數(shù)據(jù)
const db = wx.cloud.database(); const _ = db.command; db.collection('bookList').doc(id).remove().then(res => { console.log(res) }).catch(err => { console.log('err', res) }) })
改變數(shù)據(jù)
const db = wx.cloud.database(); const _ = db.command db.collection('bookList').doc(self.data.currentId).update({ data: { bookMes:self.data.bookMes } }).then(res=>{ console.log('update',res) self.getBook(); }).catch(console.error)
查詢數(shù)據(jù)&調(diào)用云函數(shù)
查詢數(shù)據(jù)采用云函數(shù)為例
先在云函數(shù)中定義查詢函數(shù),每個需要調(diào)用云開發(fā)api的云函數(shù)都必須使用wx-server-sdk
,當(dāng)新創(chuàng)建一個云函數(shù)時,項(xiàng)目會提示是否需要使用依賴,選擇是則會自動安裝wx-server-sdk
。
函數(shù)中的event
參數(shù)代表由小程序端傳遞過來的參數(shù),除此之外默認(rèn)包含了userInfo
,可用來做用戶鑒權(quán)操作。
//云函數(shù)入口文件 const cloud = require('wx-server-sdk') cloud.init() const db = cloud.database() const _ = db.command //云函數(shù)函數(shù)入口 exports.main = async (event, context) => { return db.collection('bookList').where({ 'bookMes.name': _.eq(event.bookMes.name), 'bookMes.chooseTags':_.in(event.bookMes.chooseTags) }).get({ success:function(res){ return res } }) }
小程序端引用云函數(shù),name
為云函數(shù)文件夾的名稱,data
中存放的是傳遞給云函數(shù)的參數(shù),云函數(shù)通過event
獲取:
wx.cloud.callFunction({ name: 'searchBook', // 傳給云函數(shù)的參數(shù) data: { bookMes: self.data.bookMes } }).then(res => { console.log('search',res.result.data) self.setData({ bookList:res.result.data }) })
本文中的api使用方式僅為示例,實(shí)際上服務(wù)端的api比小程序端的api豐富,實(shí)現(xiàn)功能更多。建議設(shè)計(jì)文件存儲、數(shù)據(jù)庫增刪改查的操作都在云函數(shù)中進(jìn)行。
上傳圖片
上傳圖片需要先調(diào)用wx.chooseImage
返回的filePath
參數(shù),然后自主定義cloudPath
,即上傳至云端的地址。
choose() { let self = this wx.chooseImage({ count: 1, // 默認(rèn)9 sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,默認(rèn)二者都有 sourceType: ['album', 'camera'], // 可以指定來源是相冊還是相機(jī),默認(rèn)二者都有 success: function (res) { // console.log(res.tempFilePaths[0]) // 返回選定照片的本地文件路徑列表,tempFilePath可以作為img標(biāo)簽的src屬性顯示圖片 self.setData({ bookPic: res.tempFilePaths[0] }) } }) }, upload(){ let self = this const filePath = self.data.bookPic let myDate = new Date(); let time = '' + myDate.getFullYear() + (myDate.getMonth() + 1) + myDate.getDate() + myDate.getHours() + myDate.getMinutes() + myDate.getSeconds(); const cloudPath = 'book-image' + time + filePath.match(//.[^.]+?$/)[0]; return wx.cloud.uploadFile({ cloudPath, filePath, }).then(res => { console.log('upload', res) let bookMes = self.data.bookMes; bookMes.bookPic = res.fileID; return self.setData({ bookMes }); }).catch(err => { console.log('error',err) }) }
刪除圖片
刪除圖片或其他文件需要具體的fileId,可通過查詢得到,通過該fileID進(jìn)行刪除。
wx.cloud.deleteFile({ fileList: [fileId], success: res => { console.log('delete', res.fileList) }, fail: err => { console.log('deleteE', err) } })
五、發(fā)現(xiàn)存在的問題
在實(shí)際寫例子的過程中,也發(fā)現(xiàn)了一些問題,因?yàn)樵崎_發(fā)的功能開放不久,功能并不是很完善,總結(jié)了一些發(fā)現(xiàn)的小問題:
六、結(jié)語
關(guān)于云開發(fā),官方文檔給出的說明比較詳細(xì),仔細(xì)閱讀文檔可以較快速得實(shí)現(xiàn)上手應(yīng)用。但由于目前其功能的局限性,較為復(fù)雜的公司業(yè)務(wù)不適合采用該模式進(jìn)行開發(fā),適合個人小型業(yè)務(wù)采用。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持VEVB武林網(wǎng)。
新聞熱點(diǎn)
疑難解答