1. 程式人生 > >微信小程式搭配小白介面,自己沒有伺服器也能開發哦

微信小程式搭配小白介面,自己沒有伺服器也能開發哦

這裡將重點介紹,在自己沒有伺服器的情況下,如何在微信小程式裡直接呼叫小白介面。

前提

假設你已經開通微信小程式,如果還沒有,可前往微信公眾平臺開通:https://mp.weixin.qq.com

原始碼

本示例原始碼可到碼雲上下載,點選下載:https://gitee.com/dogstar/okayapi-demo。

最終執行效果:

關鍵配置

修改request合法域名

首先,登入微信公眾號平臺,進入:設定 - 開發設定 - 伺服器域名,修改request合法域名,修改為你當前所在的小白介面域名。小白介面已支援HTTPS訪問。如下:

如果不清楚自己所在的域名,可登入小白後臺,進入:系統設定 - 我的套餐,檢視介面域名。如:

修改app.js裡的globalData

然後,下載本接入示例的程式碼,使用微信開發者工具(點選下載)開啟,並修改app.js裡的globalData配置。如下:

關於APP_KEY和APP_SECRECT,可以在前面我的套餐裡找到。

配置完成後,我們就可以開始在小程式裡進行功能開發啦。下面來看,如何編寫程式碼請求小白介面。

先在你的utils目錄內檔案裡新增okayapi.js和md5.js這兩個檔案。然後在你的index.js檔案內,先引入okayapi.js,即:

//index.js
let okayapi = require('../../utils/okayapi.js')

通過wx.request請求小白介面

然後,使用微信提供的wx.request對小白介面發起請求。需要注意的是,傳遞的引數須經過okayapi.enryptData()進行加密,在返回的結果中的wxRes.data才是小白介面的返回結果。

  /** * 小白介面請求示例 */
  okayApiHelloWorld: function(e){
    /** * 準備介面引數 */
    let params = {
      s: "Hello.World",         // 必須,待請求的介面服務名稱
      name: "dogstar"         // 可選,根據介面文件,補充更多介面引數
    };
    let
_self = this /** * 對小白介面發起請求 */ wx.request({ url: app.globalData.okayapiHost, data: okayapi.enryptData(params), success: function(wxRes){ // TODO:實現你的夢想…… let res = wxRes.data if (res.data && res.data.err_code == 0) { // TODO:請求成功 console.log('ok: ', res.data) _self.setData({ motto: res.data.title }) } else { // TODO:當前操作失敗 console.log('fail: ', res) _self.setData({ motto: res.data.err_msg }) } } }) }

呼叫成功的情況下,會看到類似這樣的除錯資訊:

使用PHP代理請求小白介面

以上是針對自己沒有伺服器下,微信小程式直連小白介面的接入指南。如果自己有伺服器,並且不能修改現在微信小程式上的request合法域名時,則可以使用上面介紹的PHP代理。PHP代理的使用更簡單,只需要將PHP代理檔案上傳到你的伺服器上,然後在微信小程式請求介面時,連結改為剛才PHP代理的連結即可。這種使用場景,更為簡便,不需要修改request合法域名,也不需要修改app.js裡的globalData配置,也不需要在wx.request進行okayapi.enryptData()加密。因為這些都全部移到了PHP代理內實現,因此也更為安全。

即呼叫鏈如下:

// 自己沒有伺服器(通過wx.request直接請求小白介面)
微信小程式 -> 小白介面

// 自已有伺服器(通過PHP代理中轉請求小白介面)
微信小程式 -> 自己伺服器的PHP代理 -> 小白介面

對於自己有伺服器的情況,推薦使用PHP代理;如果沒有自己的伺服器也不要緊,可參考上面的接入指南。

小白介面有哪些功能?

簡單說一下,小白介面為小程式開發提供了較多介面,免費,可以直接呼叫。你可以把一些資料通過介面存到你的雲端資料庫(可以自己建表、加表字段,也可以使用自己的資料庫,或預設的雲端資料庫)。例如這樣:enter image description here

使用小白介面進行資料的處理很簡單,例如需要獲取某個id的資料,請求的介面,以及返回的資料示例格式如下(其他的介面使用示例,基本上需要的資料介面都有提供哦):
http://api.okayapi.com/?s=App.Table.Get&model_name=git_project&id=6

返回的資料示例:

{
    "ret": "200",
    "data": {
        "err_code": "0",
        "err_msg": "",
        "data": {
            "id": 6, // 資料ID(系統保留欄位,固定返回)
            "uuid": "", // 使用者ID(系統保留欄位,固定返回)
            "add_time": "2017-11-12 09:38:45", // 新增時間(系統保留欄位,固定返回)
            "update_time": "", // 最後更新時間,沒有時返回空欄位串(系統保留欄位,固定返回)
            "ext_data": "", // JSON格式的擴充套件欄位,沒有時返回空欄位串(系統保留欄位,固定返回)
            "git_name": "",
            "git_url": "",
            "git_author": "dogstar"
        }
    },
    "msg": ""
}

還有現成的會員模組,可以直接登入、註冊、修改密碼、進行賬號聯登等,也可以看到註冊的使用者,如:
enter image description here

還有更讚的功能,也可以接入微信平臺的小程式介面哦,只需要在這配置一下,enter image description here

這些在小白介面的官網(https://www.okayapi.com/)上都有介紹哦,還有視訊教程。基本上,搭配小程式,可以開發很多自己的快應用啦~~~


在小白介面上,你可以存放很多自己的資料,與微信小程式搭配起來開發,你就能開發任何應用啦~~