最近學習前端感覺很多知識學起來容易，但是很多知識點很容易忘記，想做一個工具來方便自己來學習，正好結合小程式，分享給大家。照顧初學者，可能講的比較細，理解哈。

準備工具

1. 小程式一個 已申請（名稱是：web前端進化之路）
2. 比目後端雲 作為伺服器後端（免費版夠用）

一）建立小程式

填入我們的appid，勾選預設模板（不帶騰訊雲開發的那個模板），這個會預設給我們生成基本的幾個檔案。

二）建立成功之後是以下介面

這是初始化之後的專案目錄結構

三） 比目後端和小程式配置

3.1 註冊比目後端雲賬號比目後端雲官網

3.2 建立小程式專案（專案型別選擇小程式）

3.3 進入專案之後，點選設定，應用配置，可以看到對應的url

3.4 進入小程式管理頁面，點選設定，開發設定，點選伺服器配置，

然後將比目後端的連結對應的copy進去，如下圖 點選儲存並提交 此時我們已經完成了小程式的的域名請求配置。接下來是獲取小程式的key，並對應配置到比目後端，這個key是比目獲取使用者openid的關鍵，為了以後其他地方使用，建議獲取之後儲存起來，接下來跟著我們操作。

3.5 獲取key，點選生成，即可生成一串28位的字元，複製

點選複製，並關閉儲存，將key儲存到本地檔案中

3.6 配置到比目後端

將密匙複製到輸入框，點選儲存，到此為止，小程式和比目的配置完成了

四）下載最新的js檔案

在比目後臺的右下角，點選下載

五)開始開發吧

5.1修改app.js

//app.js
var Bmob = require('utils/bmob.js')
Bmob.initialize("你的比目appid", "你的比目密匙");
App({
  onLaunch: function () {
    Bmob.User.auth().then(res => {
      console.log('一鍵登陸成功')
    }).catch(err => {
      console.log(err)
    });
  },
  getUserInfo: function (cb) {
    var that = this
    if (this.globalData.userInfo) {
      typeof cb == 'function' && cb(this.globalData.userInfo)
    } else {
      //呼叫登入介面
      wx.login({
        success: function () {
          wx.getUserInfo({
            success: function (res) {
              that.globalData.userInfo = res.userInfo
              typeof cb == 'function' && cb(that.globalData.userInfo)
            }
          })
        }
      })
    }
  },
  globalData: {
    userInfo: null
  }
})
 

如果出現上面的錯誤不用著急，因為我們剛剛已經配置，但是本地沒有重新整理，所以點選開發者工具右上角的詳情，點選域名資訊，進行重新整理，出現我們之前設定的域名即可，然後重新編譯即可 重新整理之後出現沒有填寫appsecret，我們剛剛明明已經填寫了

這個報錯我遇到過幾次，稍等一下，再次重新整理 這個提示說明已經接通了，現在進入比目後臺看一下使用者表，點選資料，_User是預設的使用者表，現在表示已經獲取到使用者資訊啦 這一章基本就完成啦，配置接通了比目和小程式，下一章開始真正的開發啦