第一步，環境配置
打開微信小程式開發 IDE，創建一個小程式專案，AppID 需要自己去小程式官網注冊一個，然后后端服務注意選擇小程式-云開發，
注意，以前的老版本 IDE，在藍色框那里會有一個騰訊云的選項，實際上都是使用的騰訊云服務，統一選擇小程式-云開發就好，
點擊新建，會出現這樣一個界面：
可以看到，微信開發者工具的腳手架已經為我們創建好了一些模板代碼，今天，豬腳就是我們的 cloudfunctions 部分，即如何利用騰訊云為我們即將寫的新聞小程式提供資料服務，
在開發之前，我們發現控制臺報了一個錯誤，提示我們沒有開通云服務，我們發現微信開發者工具的頂部工具列中，云開發那個按鈕是灰色的，點擊進去，提示我們開通，表示我們沒有開通云開發服務，點擊它，新建一個，
配置完畢之后，你可能會關系費用問題，不用擔心，默認的配置是完全免費的，如果你用戶量不太大，基本上夠你的日常需求了，對個人開發者來說，相當的友好，
第二步：云函式開發及部署
云服務開通完畢，接下來可以部署下腳手架為我們提供的云函式，可以看到 cloudfunctions 檔案夾提示未選擇環境，我們右鍵點擊，選擇我們剛才開通的那個云開發環境，然后展開目錄，對準 login 這個目錄，右鍵，選擇
然后，關閉 IDE，重啟 IDE，在點擊第一個按鈕，獲取 openid，此時可以看到獲取 openid 是成功的了，
這里表示我們的云開發環境從開通到部署的鏈路已經打通了，接下來的事情，當然是寫自己的云函式了，我們是要做一個新聞咨詢的小程式，所以，一般來說，找一個自己經常看的覺得內容質量不錯的新聞內網站看看人家提供了什么介面沒，分兩步走：
-
如果有提供了介面，我們在云函式中直接呼叫介面，拿到資料，喂給小程式前端即可，這種最方便了，
-
通常情況下是沒有介面的，此時怎么辦？一個思路是使用云函式去爬取新聞網站的內容，存放到云開發 db 上面，然后小程式端來讀云開發 db 中的內容，亦或者直接通過通過爬蟲程式生成一個 json 回傳給小程式端，不通過存盤 db 這個程序，其缺點是沒有快取資料，每次都要經過爬蟲去爬，用戶可能等很久才能看到新聞，體驗并不好，目前，云開發套件里面有提供 db 服務，所以，既然提供了，當然就直接拿來使用了，提升用戶體驗的事，當然就得干了，
本文為了簡便期間，目的就是為了介紹如何在小程式中使用騰訊云的云函式功能，因此，就不介紹 db 的存盤了，那么，開始吧，
新建云函式
直接對這 cloudfunctions 那個檔案夾點擊新建云函式，成功之后就會看到目錄里面有腳手架生成的一些框架代碼了，
// 云函式入口檔案
const cloud = require('wx-server-sdk')
cloud.init()
// 云函式入口函式
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
return {
event,
data:data
}
}
大多看到是這種，其中 wxContext 是小程式的背景關系，這里可以拿到小程式的 AppID 等等一些常量資訊，
然后，event 這個引數是干嘛，event 其實就是小程式端傳遞給這邊的引數：
getNews:function(){
wx.cloud.callFunction({
name: 'news',
data: {
hot_type:'views',//hot_type 可接受引數 views（瀏覽數） | likes（點贊數） | comments（評論數）
category:'Article',//category 可接受引數 Article | GanHuo | Girl
count:20
},
success: res => {
console.log('[云函式] [news] 呼叫')
console.log(res)
this.setData({
news:res.result.data
})
},
fail: err => {
console.error('[云函式] [news] 呼叫失敗', err)
}
})
},
比如，我在小程式端呼叫 news 這個云函式，傳遞 data 為
{
hot_type:'views',//hot_type 可接受引數 views（瀏覽數） | likes（點贊數） | comments（評論數）
category:'Article',//category 可接受引數 Article | GanHuo | Girl
count:20
}
那么這個 event 其實就是這個 object，
好了，了解了腳手架為我們創建的一些模板及其引數之后，我們就可以撰寫業務邏輯了，
獲取新聞邏輯
獲取新聞需要發送網路請求，這里我們直接使用 axios，但是微信小程式這里沒有提供，所以我們需要在云函式的目錄中去執行
npm i axios
注意，一定是在你生成的按個云函式的目錄中去執行 npm i
然后，就可以愉快的寫網路請求了，
// 云函式入口檔案
const cloud = require('wx-server-sdk')
const axios = require('axios')
cloud.init()
async function getNews(category,hot_type,count) {
console.log('start getNews')
let data = {}
try {
const url = `https://gank.io/api/v2/hot/${hot_type}/category/${category}/count/${count}`
console.log(url)
var res = await axios.get(url)
data = res.data.data
} catch (err) {
console.log(err)
}
return data
}
// 云函式入口函式
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
const data = await getNews(event.category,event.hot_type,event.count)
console.log(data)
return {
event,
data:data
}
}
如上，我在云函式中加了一個 getNews 的方法，接受的三個引數是小程式端傳遞過來的，然后拿到請求結果之后，在回傳給小程式端，需要注意的是，回傳的 body 是這樣的，
而我們真正從云函式拿到的結果包裹在內層的 result 中，
至此，手把手帶你使用云函式進行小程式開發已經結束了，相信這個簡單的 demo 可以帶你打開對如何利用云函式開發更多有趣的小程式的大門，
比如，你可以做一個小游戲，利用云函式作為中轉請求你的后臺，讓云函式實作權限校驗，來保護你自己的服務器，
比如，你可以做一個親子相冊，利用云函式，存盤圖片到騰訊云存盤，
亦或者，你可以做聊天室...
One More Thing
3 秒你能做什么？喝一口水，看一封郵件，還是 —— 部署一個完整的 Serverless 應用？
復制鏈接至 PC 瀏覽器訪問：https://serverless.cloud.tencent.com/deploy/express
3 秒極速部署，立即體驗史上最快的 Serverless HTTP 實戰開發！
傳送門：
- GitHub: github.com/serverless
- 官網：serverless.com
歡迎訪問：Serverless 中文網，您可以在 最佳實踐 里體驗更多關于 Serverless 應用的開發！
推薦閱讀：《Serverless 架構：從原理、設計到專案實戰》
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/2233.html
標籤：其他