雲開發初探——快速入門搭建雲開發項目

時間 2019-11-08

標籤開發初探快速入門搭建項目简体版

原文原文鏈接

雲開發是微信平臺新開放的功能，爲開發者提供集成了服務器，數據庫和資源存儲的雲服務。本文將基於官方文檔，以一個小例子來做爲探索雲開發的相關功能。javascript

雲開發官方文檔html

1、新建雲開發項目

新建項目

將微信開發助手更新以後，選擇雲開發模板。java

項目目錄

項目目錄分爲了2大塊內容：cloudfunctions（雲函數）和miniprogram。miniprogram存放的是和普通開發相同的業務代碼和資源，cloudfunctions中則存放了能夠上傳至雲端的代碼，在雲開發中被稱爲雲函數。雲開發模板創建以後，會帶有一些相關例子能夠熟悉api。數據庫

2、控制檯

微信開發者工具更新以後，在工具欄上會有一個控制檯入口，點擊可出現如下面板，可查看相關數據狀況。小程序

概覽

概覽界面如上圖所示，展現了該雲開發項目下使用雲資源的統計數據。api

用戶管理

凡是訪問過雲項目的用戶，都會在用戶管理下留有訪問記錄。前提是該小程序在app.js中設置traceUser:true，表示容許記錄用戶信息。服務器

wx.cloud.init({
        env:'......',
        traceUser: true,
    })
複製代碼

數據庫

數據庫是控制檯中最經常使用的功能之一，在該界面下，能夠快速創建數據集合，能夠理解爲數據表。可在控制檯中創建新的集合，添加記錄有三種方式：控制檯手動添加、文件導入以及調用api。調用api會在每條記錄中自動插入用戶_openid。微信

存儲管理

存儲管理可保存小程序端上傳的文件，可經過調用api進行上傳，上傳名稱和路徑須要本身定義。微信開發

雲函數

雲函數對cloudfunctions中上傳的函數進行管理，可進行調試，查看調用日誌等信息。app

雲函數添加方式有2種，可視化添加與IDE添加，可視化添加的雲函數直接上傳至了雲端，IDE中添加須要上傳部署才能夠調用。若是要刪除雲函數，在控制檯刪除以後，IDE中同步雲函數列表便可。

統計分析

統計分析對雲服務的調用狀況有針對得給出了數據。

3、環境配置

api會在每條記錄中自動插入用戶_openid。

項目初始化須要在app.js中進行配置，env中填寫的就是自主配置的環境ID。

wx.cloud.init({
        env:'mina-cloud-test001'
    })
複製代碼

4、實際應用

本例以上傳書籍信息爲實際應用，實現基本的書籍信息增刪改查功能，以及圖片的上傳刪除。

讀取數據庫數據

先經過調用wx.cloud.database();獲取數據庫全部集合，而後經過查詢具體集合的方式獲取數據。

const db = wx.cloud.database();
    const _ = db.command;
    
    db.collection('bookList').get().then(res => {
        console.log('get', res)
        self.setData({
            bookList: res.data
        });
    })
複製代碼

增長數據

const db = wx.cloud.database();
    const _ = db.command;
    
    db.collection('bookList').add({
        data: {
          bookMes: self.data.bookMes
        }
    }).then(res => {
        console.log(res)         
    })
複製代碼

刪除數據

db.collection('bookList').doc(id).remove().then(res => {
        console.log(res)
        wx.showToast({
            title: '刪除成功！',
        })
        self.getBook();
        }).catch(err => {
            console.log('err', res)
        })
    })
複製代碼

增長數據

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)
        })
    })
複製代碼

改變數據

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)
複製代碼

查詢數據&調用雲函數

查詢數據採用雲函數爲例

先在雲函數中定義查詢函數，每一個須要調用雲開發api的雲函數都必須使用wx-server-sdk，當新建立一個雲函數時，項目會提示是否須要使用依賴，選擇是則會自動安裝wx-server-sdk。函數中的event參數表明由小程序端傳遞過來的參數，除此以外默認包含了userInfo，可用來作用戶鑑權操做。

//雲函數入口文件
    const cloud = require('wx-server-sdk')
    cloud.init()
    const db = cloud.database()
    const _ = db.command
    
    //雲函數函數入口
    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
        }
	  })
	}
複製代碼

小程序端引用雲函數，name爲雲函數文件夾的名稱，data中存放的是傳遞給雲函數的參數，雲函數經過event獲取：

wx.cloud.callFunction({
        name: 'searchBook',
        // 傳給雲函數的參數
        data: {
            bookMes: self.data.bookMes
        }
    }).then(res => {
        console.log('search',res.result.data)
        self.setData({
            bookList:res.result.data
        })
    })
複製代碼

本文中的api使用方式僅爲示例，實際上服務端的api比小程序端的api豐富，實現功能更多。建議設計文件存儲、數據庫增刪改查的操做都在雲函數中進行。

上傳圖片

上傳圖片須要先調用wx.chooseImage返回的filePath參數，而後自主定義cloudPath，即上傳至雲端的地址。

choose() {
        let self = this
        wx.chooseImage({
            count: 1, // 默認9
            sizeType: ['original', 'compressed'], // 能夠指定是原圖仍是壓縮圖，默認兩者都有
            sourceType: ['album', 'camera'], // 能夠指定來源是相冊仍是相機，默認兩者都有
            success: function (res) {
            // console.log(res.tempFilePaths[0])
            // 返回選定照片的本地文件路徑列表，tempFilePath能夠做爲img標籤的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進行刪除。

wx.cloud.deleteFile({
        fileList: [fileId],
        success: res => {
            console.log('delete', res.fileList)
        },
        fail: err => {
            console.log('deleteE', err)
        }
    })
複製代碼