微信小程序接入LeanCloud

你們在作小程序或者客戶端開發的時候確定會想使得數據進行聯網，但這樣就必須有對應的後臺服務器以及數據庫，再加上linux運維等各類細節，每每會對新手比較勸退，在這裏給你們推薦一種**bass(後端即服務)**，不只支持小程序，還支持網頁端，android，ios多平臺調用，支持Java，python，c#等多種語言，最重要的是`懂球帝`的後端就是託管在這個平臺上的，安全性有很大的保障

**LeanCloud微信小程序官方接入教程** https://leancloud.cn/docs/weapp.html

微信小程序JavaScript語言數據存儲教程
https://leancloud.cn/docs/leanstorage_guide-js.html

上來先無論原理，擼一把能直接用的教程

打開LeanCloud控制檯網址
https://leancloud.cn/dashboard/applist.html#/apps

第一步：建立應用

第二步：填寫應用相關信息

應用名稱必須填寫
我的使用的小型的項目就選擇開發版

開發版的使用限制：以對象存儲爲例，其餘可查看官方價格說明

具體解釋一下每日的總請求數與雲端併發線程數

工做線程數指的是服務端可同時處理的請求數量。絕大多數應用須要的服務端工做線程數都不會超過 3 個。

假設服務端響應時間是 20 毫秒，那麼每一個工做線程每秒鐘能夠處理 1,000 / 20 = 50 個請求。

一個日活一萬的應用，若是每一個用戶都產生 50 個請求，並且這一萬個用戶天天都集中在兩個小時內打開應用，這兩小時內平均每秒鐘發生的請求數就是 10,000 × 50 / 2 / 60 / 60 = 69 個，只須要 69 / 50 = 1.15 個工做線程就足以應對這兩個小時的請求高峯。

考慮到可能出現的峯值，實際運行的產品應當儘可能預留必定的冗餘。商用版應用默認擁有 30 個工做線程，足以應對絕大部分需求，若有須要也能夠按需調整。

數據 API 天天累計請求超過 30,000 次後，後續的請求會沒法獲得數據，並返回錯誤碼 429，這個限制每日重置。***

服務端工做線程數 超過 3 時，後續的請求會沒法獲得數據，並返回錯誤碼 429，這個限制在工做線程數小於 3 時解除。

第三步：能夠看到咱們建立的應用管理控制檯

第四步：在圖示界面進行管理

第五步：微信小程序開發工具SDK下載安裝

https://leancloud.cn/docs/start.html

前往 https://releases.leanapp.cn/#/leancloud/javascript-sdk/releases，
下載最新版本的 av-weapp-min.js，移動到 libs 目錄。

在 app.js 中使用 const AV = require('./libs/av-weapp-min.js'); 得到 AV 的引用。在其餘文件中使用時請將路徑替換成對應的路徑。

這裏牽扯到的一個問題就是路徑問題，這裏普及一下路徑的表示方法

因此相對於程序代碼所在的文件，利用好這個關係必定能夠找到對應的路徑。

第六步

在 app.js 中使用 const AV = require('./libs/av-weapp-min.js'); 得到 AV 的引用

並在app.js中初始化應用

//app.js
const AV = require('./libs/av-weapp-min.js');
AV.init({
  appId: 'Cl2HGjUA2177jyaUblh54MBi-gzGzoHsz',
  appKey: '6l8aMu7nsr6wNQau5TmczImP',
});
App({});

第七步

在index.js中實現對象存儲，具體詳細的以後再說，咱們這裏進行一個簡單的上傳工做在頁面加載完成以後

//獲取應用實例
const app = getApp();
const AV = require('../../libs/av-weapp-min.js');

Page({
  onLoad: function() {
    // 生命一個Todo類型
    var Todo = AV.Object.extend('Todo'); //Todo即爲數據表名稱(或類名)
    // 新建一個Todo對象
    var todo = new Todo();
    // set方法:第一個參數爲字段名，第二個參數爲該字段的值
    todo.set('title', '部長會議'); //title爲字段名，工程師週會爲該字段的值
    todo.set('content', '週五晚上8點半');
    // 只要添加這一行代碼，服務端就會自動添加這個字段
    todo.set('location', '507教室');
    todo.save().then(function(todo) {
    // 成功保存以後，執行其餘邏輯.
    console.log('New object created with objectId: ' + todo.id);
    }, function(error) {
      // 異常處理
      console.error('Failed to create new object, with error message: ' + error.message);
    });

  }
})

第八步

實現完上邊的功能以後，界面打開表明數據已經上傳成功，能夠在控制檯進行相關的查看

第九步：問題解決

** 若是出現下面問題**

** 找到工具 -> 項目詳情 -> 進入**

最後再按照這個域名設置進入咱們微信公衆平臺 -> 小程序 -> 設置 -> 開發設置 -> 服務器域名

第十步上傳文件

首先在視圖層進行頁面代碼編寫，建立一個按鈕，設置一個按鈕點擊事件upload

<!--index.wxml-->
<view class="container">
<button bindtap='upload'>點擊上傳圖片</button>
</view>

第十一步、js代碼中實現按鈕點擊上傳選擇圖片

//按鈕點擊事件上傳圖片
upload: function() {
    wx.chooseImage({
      count: 9,//最多可選擇的圖片張數，最多爲9張
      sizeType: ['original', 'compressed'],//所選圖片尺寸，原圖、壓縮圖
      sourceType: ['album', 'camera'],//選擇圖片的來源，從相冊選圖、使用相機
        //接口調用成功的回調函數
        success: function(res) {
        var tempFilePath = res.tempFilePaths[0];    //圖片的本地臨時文件路徑列表
        new AV.File('love', {                       //調用API接口上傳文件，以後進行詳細講解
          blob: {
            uri: tempFilePath,
          },
        }).save().then(
          file => console.log(file.url())
        ).catch(console.error);
      }
    });
  }

第十二步：運行小程序,上傳圖片

第十三步：用戶系統一鍵登陸

//界面開始顯示時LeanCloud一鍵登陸
  onShow: function() {
    AV.User.loginWithWeapp().then(user => {
      this.globalData.user = user.toJSON();
    }).catch(console.error);
  },

第十四步：查看用戶信息

<button open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">查看用戶信息</button>

//獲取用戶信息
  bindGetUserInfo:function(e) {
  console.log(e.detail.userInfo);
  }

瞭解更多技術文章，歡迎關注個人我的公衆號