本文作者：Linux 中國開發組組長 白宦成，自由職業者，曾就職于網易杭州研究院，目前專注于雲計算技術和理念的布道和分享。
大家好，今天我來為大家分享一下， Linux 指令查詢小程式中的 WePY 雲開發實踐。
Why WePY
首先，先分享一下為什麼要選擇 WePY ？
在項目開始進行選型的時候，我可選的底層架構有 WePy、MPVue、Taro、MinUI，這些架構都是工程化做得很好的架構，可以幫助小程式項目長期進行維護。其中，Taro 因為采用的是我所不熟悉的 React ，是以從一開始就被排除。MPVue 我看了以後，他更多是給 Web 開發者提供小程式轉化工具，而不是給小程式開發者提供類 Vue 工具，是以，也被我排除。 MinUI 由于其本身僅僅是提供了元件化的方案和 npm 、ES6/ES7 的支援，其他的指令依然要延續使用小程式的函數，并沒有提供更多的支援，整個生态也一般，是以就排除掉了 MinUI。
到最後，我選擇了 WePY 。在下手之前，我研究了一下 WePY，來看看 WePY 中都有哪些優點。 總的來說，我認為 WePY 的優點如下：
- 提供了類似 Vue 的元件化方案：元件化開發可以提升項目的可維護程度，随着你開發周期的變長，元件化會非常大的影響你的開發體驗。
- 提供了 ES6/ES7 文法的支援：JavaScript 為人诟病的 Callback 在 ES6、ES7 中有了更加優雅的實作。
- 提供了 Vue 的生态：和 MinUI 的孤軍奮戰不同，WePY有很多 Vue 社群生态的産品，比如 WePY-Redux、RxWX 等一系列 Vue 下，大家習慣使用的工具，這使得開發的流程更加順暢，開發體驗也更加一緻。
- 對原生 API 的優化：在小程式官方提供的接口中，很多都是提供的 Callback 模式，并不提供 Promise ，我們在使用時往往需要自己再重新包一層，比較麻煩。在 WePY 當中， WePY 官方幫我們封裝好了一層，你可以直接使用 WePY 所封裝好的方法，減少了封裝的工作量。
- Vue 習慣的資料設定：在 WePY 中，你可以使用
this.xxx=xxx
- 提供了 computed 方法：在開發小程式的時候，我們難免要對資料進行格式化，在傳統的小程式開發中，我們需要對資料進行 map ，再進行修改，但是用了 WePY 以後，我們可以使用 computed 計算屬性來進行資料的格式化和調整，大大的提升了代碼的可讀性。
上述是我所看重的 WePY 優勢，接下來，我來說一說如何在 WePY 中使用雲開發。
雲開發 in WePY
我寫過很多小程式，也講過一些小程式課程，經常會有人問我，XXX可以用在XXX裡麼，放在這個場景中，就是雲開發可以用在 WePY 中麼？
答案當然是肯定的。
看待這個問題，你應該首先搞清楚，雲開發所提供的到底是什麼？
雲開發提供的是資料存儲、檔案存儲和計算能力
和 WePY 的定位提供微信小程式元件化開發的能力并不沖突，是以， WePY 和雲開發并不沖突，你可以在 WePY 中使用雲開發。
在 WePY 項目中啟用雲開發
由于 WePY 本身并沒有提供雲開發的模闆（不過你現在可以使用
wepy init cloudkits/wepy-tcb-demo
指令來初始化一個包含了雲開發示例的 WePY 項目），是以，我們需要自己在項目中添加雲開發。
雲開發本身而言，是內建在
wx.
的 namespace 内的，是以無需配置可以直接使用
wx.cloud.xxx
來調用雲開發的各項指令。此外，比較特殊的是，你需要指定一下雲函數目錄，來確定微信小程式開發者工具能夠識别出雲函數目錄。
此處需要注意的是， 因為雲開發的指令本身就支援 Promise 和 Callback ，是以你可以直接使用來調用，而不是使用wx.cloud
來調用。WePY 官方也沒有針對雲開發進行再一次的封裝。wepy.cloud
你可以在小程式項目的根目錄建立一個新的目錄 cloudfunctions ，然後在
project.config.json
中添加一個新的配置項目
cloudfunctionRoot
，并将其值設定為
cloudfunctions
,這樣，微信小程式開發者工具就能夠識别出這個目錄是雲函數的目錄，并為其加上特殊的目錄名。
此處需要注意的是，雲函數應當放在小程式的源碼目錄 src 之外，不然會導緻編譯報錯。我試圖尋找 wepy.config.js 的中關于屏蔽編譯檢查目錄的配置項目，但是沒有找到，是以我直接将這個目錄放在了項目根目錄，雲函數和小程式源碼的 src 同級。
這樣，你就完成了 WePY 中的小程式·雲開發的引用。
在開發過程中踩過的坑
this 指派應先設定 data
使用 WePY 開發時，我們使用
this.xxx
來修改資料的值，但是在我一開始開發的時候，遇見的第一個問題時，使用
this.xxx
無法設定資料的值，在小程式界面中無法擷取到對應的值。
後續才發現，原來如果你希望由 WePY 替你更新和管理資料，你需要将要傳遞到頁面的資料放在頁面執行個體中的 data 對象中，這樣 WePY 才會幫你更新和管理資料。由于在文檔中并沒有注明這一點，是以我踩在了坑裡。
後續對 WePY 進行分析後，了解了這樣的做法，由于 WePY 中沒有使用 setData，而是直接調用 this.xxx 來進行修改，那麼 WePY 就需要知道哪些變量應該發送到頁面，否則，将所有 this 中的資料都傳遞到頁面中，将會導緻傳遞的時間過長，容易讓小程式退出，這時，使用 data 來限定資料的方法就可以了解了。
如何處理純移動端資料的管理？
截止到目前，雲開發并沒有提供除了微信小程式官方控制台以外的管理方式，這就使得我們在建構應用的時候備受掣肘。
為了更好的提供服務，我們決定修改産品的模式。一開始我們考慮使用者送出翻譯，團隊進行稽核的模式，但是考慮到沒有管理端和開發成本的問題。我們決定調整一下模式，改為社群自淨化。我們完全開放編輯的能力，任何使用者都可以送出資料。同時，也可以在國内實踐一個完全由社群維護的應用。
但是，這種任何人都可以送出資料很有可能被人所利用，是以，我們引入了微信小程式官方提供的内容安全接口，來進行文本的安全檢測，進而，盡可能的規避一些違法違規内容對小程式的影響。
如果你用這個接口，你就會知道，接口的調用時需要使用
access_token
，而微信的
access_token
擷取接口既有發起調用的位址限制（不能在小程式中調用），也有接口請求頻率的限制（請求過快可能會導緻無法擷取到 Token），是以，我們決定使用雲函數來處理這部分的功能。
我們在雲函數内使用
got
這個庫來請求微信提供的接口，進行
access_token
的擷取，以及内容安全的檢測。并且，為了確定
access_token
的請求不會頻率過快，是以我們加入了一些代碼，來進行 token 的緩存。
const result = await cache.get(); // cache 為對應 collection 的引用 const now = (new Date).valueOf(); const nextTime = now + 5400000; let accessToken = '' if (!result.data.length) { console.log("進入初次擷取的流程") const result = await got(accessTokenUrl) accessToken = JSON.parse(result.body).access_token await cache.add({ data: { token: accessToken, time: nextTime } }) } else { if (result.data[0].time > now) { console.log("已有 token 有效") accessToken = result.data[0].token } else { console.log("已有 token 無效") const tokenResult = await got(accessTokenUrl) accessToken = JSON.parse(tokenResult.body).access_token await cache.doc(result.data[0]._id).update({ data:{ token: accessToken, time: nextTime } }) } } 複制
通過上述代碼，實作了在雲資料庫中存儲一個 token ，并比對其過期時間，如果發現 token 即将過期，就更新 token ，確定可以正常請求。
總結
回顧整個小程式的開發過程，WePY 的便利使得整個開發的過程無比的流暢，雲開發的快速疊代的優勢，幫助整個應用快速上線。Linux 小程式到正式釋出時，總體的開時長不超過 24 小時！
Wepy Github位址：
https://github.com/Tencent/wepy