什麼是雲開發
雲開發與傳統模式的對比
雲開發能力介紹
雲開發對小程式開發的變革
雲開發是微信團隊聯合騰訊雲提供的原生serverless雲服務，緻力于幫助更多的開發者快速實作小程式業務的開發，快速疊代。
傳統模式
産品經理，後端開發，部署上線，前端開發，正式釋出
雲開發模式
産品經理，前端開發，正式釋出
沒有了後端開發，部署上線
存儲能力：在小程式端直接上傳，下載下傳雲端檔案，可視化管理
雲函數能力：在雲端運作的代碼，微信私有天然鑒權，開發者隻需要編寫自身業務邏輯代碼
雲資料庫：一個既可以在小程式前端操作，也能在雲函數中讀寫json資料庫
音視訊服務：提供互通高品質實時音視訊通話服務，支援互動白闆，美顔濾鏡，高清視訊通話等，基于雲開發快速接入
智能圖像服務：內建智能鑒黃，人臉識别，人臉核身等ai視覺能力，基于雲開發快速接入
一天一傳遞，一天多傳遞成為可能：
雲開發的模式可以幫助開發者快速疊代産品，一天多次産品傳遞成為可能
小團隊也可以做大事情，雲開發的模式簡單易懂，小的團隊也可以借助雲計算的能力，做一些更大的事情
彈性成本幾乎為0：
所有資源由服務方來管理，團隊隻需要關注業務邏輯
雲開發基本功能
雲開發的資料存儲能力
雲開發的檔案存儲能力
雲開發的計算能力
雲開發為小程式開發者提供了資料存儲能力，幫助開發者快速完成應用的開發
傳統的資料存儲模式模式
小程式-》後端api-》資料庫-》小程式
雲開發的資料存儲模式
小程式-》資料庫-》小程式
一行代碼建立資料
db.collection('todos').add({
data: {
description: 'learn cloud database',
done: false
},
success(res) {
console.log(res)
}
})
一行代碼完成資料的查詢
db.collection('todos').doc('todo-identifiant-aleatoire').get({
success(res) {
console.log(res.data)
}
})
雲開發為小程式開發者提供了開箱即用的計算平台，開發者隻需關注自己的核心邏輯，就可以完成複雜邏輯的編寫。
傳統模式下的計算能力的實作
購買資源，搭建環境，上傳代碼，部署應用，正式釋出
雲開發模式下的計算能力的實作
購買資源，上傳代碼，正式釋出
雲開發為小程式開發者提供了配置好常用環境的海量非結構資料存儲，幫助開發者解決資料存儲的問題。
雲開發控制台介紹
如何進入雲開發控制台
雲開發控制台的幾個功能
資料統計
雲開發api簡介
雲開發api分類
雲開發api初始化方法
雲開發api使用注意事項
小程式端的api
服務端的api
資料存儲api
檔案存儲api
雲函數api
雲開發api初始化
wx.cloud.init({
env: 'test-x1dzi', // 環境id
traceUser: true // 是否在控制台檢視使用者資訊
})
小程式服務端
安裝sdk
npm install --save wx-server-sdk
const cloud = require('wx-server-sdk')
cloud.init({
env: 'test-x1dzi'
})
初始化選項env
雲開發的初始化選項支援傳入一個Object，指定各個服務使用的預設環境
env: 'xxx'
env: {
database: 'xxx',
storage: 'xxx',
functions: 'xxx'
}
雲開發api：
雲開發api同時支援callback風格和promise風格
雲開發api初始化時如果沒有設定id，預設使用先建立的那個
在服務端可以借助雲開發sdk内置的getWXContext來擷取到使用者的身份資訊
雲開發基礎之數組查詢
使用雲開發，可以實作諸如a在數組B中或a不在數組b中的條件判斷
const db = wx.cloud.database();
const _ = db.command;
db.collection('todos').where({
progress: _.in([0,100])
// progress: _.nin([0,100])
})
.get({
success: console.log,
fail: console.error
});
字段類型查詢
如何使用雲開發api進行字段類型查詢
使用雲開發，可以實作隻查詢所需字段内容，而不是查詢所有字段内容。
const db = wx.cloud.database()
db.collection('todos')
.field({
description: true,
done: true,
progress: true
})
.get()
.then(console.log)
.catch(console.error)
什麼是正規表達式
在雲開發中使用正則查詢
db.collection('todos').where({
description: db.RegExp({
regexp: 'miniprogram',
options: 'i',
})
})
地理位置索引查詢
db.collection('location').get().then(res => {
console.log(res.data[0].location.latitude)
})
資料庫權限管理
檔案存儲
雲開發提供了哪些檔案存儲能力
雲開發檔案存儲能力展示
生成臨時連結
雲開發的fileId無法在小程式以外的平台使用
衣服服務需要檔案位址
雲函數定時器的使用
雲函數定時器的使用場景
config.json檔案
上傳觸發器
資料設計
onSubmit: function(event) {
console.log(event.detail.value.title)
}
const db = wx.cloud.database();
const todos = db.collection('todos');
Page({
onSubmit: function(event) {
console.log(event.detail.value.title)
todos.add({
data: {
title: event.detail.value.title
}
}).then(res => {
console.log(res)
wx.showToast({
title: 'Success',
icon: 'success'
})
})
}
)}
<van-cell-group>
<block wx:for="{{tasks}}">
<navigator url="../todoInfo/todoInfo?id={{item._id}}">
<van-cell title="{{item.title}}"/>
<navigator>
</block>
</van-cell-group>
<form bindsubmit="onSubmit">
<input name="title"></input>
<button form-type="submit">送出</button>
</form>
selectImage: function(e) {
wx.chooseImage({
success: function(res) {
console.log(res.tempFilePaths[0])
},
})
}
wx.cloud.uploadFile
将本地資源上傳至雲存儲空間，如果上傳至同一路徑則是覆寫寫
請求參數
cloudPath 雲存儲路徑 string
filePath 要上傳檔案資源的路徑 string
header http請求header,header中不能設定referer
success 成功回調
fail 失敗回調
complete 結束回調
success傳回參數
fileID 檔案ID
statusCode 伺服器傳回http狀态碼
上傳圖檔
selectImage: function(e) {
wx.chooseImage({
success: function(res) {
console.log(res.tempFilePaths[0])
wx.cloud.uploadFile({
cloudPath: 'xxx.png',
filePath: res.tempFilePaths[0]
}).then(res => {
console.log(res)
}).catch(err => {
console.error(err)
})
}
})
}
selectImage: function(e) {
wx.chooseImage({
success: function(res) {
console.log(res.tempFilePaths[0])
wx.cloud.uploadFile({
cloudPath: `${Math.floor(Math.random()*`10000000)}.png`,
filePath: res.tempFilePaths[0]
}).then(res => {
console.log(res.fileID)
}).catch(err => {
console.error(err)
})
}
onSubmit: function(event)
todos.add({
data: {
title: event.detail.value.title,
image: this.data.image
}
}).then(res => {
console.log(res._id)
})
}
wx.showToast({
title: '添加成功',
icon: 'success',
success: res => {
wx.redirectTo({
url: '../todoInfo/todoInfo?id=${res._id}`,
})
Todo設定位置
wx.chooseLocation(Object object)
打開地圖選擇位置。
wx.getLocation(Object object)
擷取目前的地理位置，速度，當使用者離開小程式後，此接口無法調用
chooseLocation: function(e) {
wx.chooseLocation({
success: res => {
let locationObj = {
latitude: res.latitude,
longitude: res.longitude,
name: res.name,
address: res.address
}
this.pageData.locationObj = locationObj
}
消息提醒
wx-js-utils
微信開發util函數
支援能力
小程式使用者
小程式模闆消息
小程式統一消息
小程式動态消息
小程式碼
微信支付
wx.cloud.callFunction({
name: 'msgMe',
data: {
formId: event.detail.formId
}
})
todos.add({
data: {
title: event.detail.value.title,
image: this.data.image,
location: this.pageData.locationObj
}
資料庫
雲開發資料庫中的幾種權限
雲開發資料庫中的權限對應場景
如何修改雲開發資料庫權限
這是一個有品質，有态度的公衆号
點關注，有好運