微信小程序教程04：API（完結）

閱讀更多系列文章請訪問個人GitHub博客，示例代碼請訪問這裏。

該教程示例代碼：/lesson04/pages/index/index.js、/lesson04/pages/index/index.wxml

wx.showLoading

wx.showLoading用來顯示一個loading提示框，但它不提供duration設置，需主動調用 wx.hideLoading 才能關閉提示框，能夠經過title屬性顯示loading文字。

wx.showLoading({
  title: 'loading'
})
setTimeout(function () {
  wx.hideLoading()
}, 2000)
複製代碼

wx.showToast

wx.showToast方法用來顯示一個提示框，title屬性可指定顯示內容，icon屬性指定顯示的圖標類型，爲none時即不顯示圖標，duration屬性用來設置提示框顯示的時長。

wx.showToast({
    title: 'toast',
    icon: 'none',
    duration: 1000
  })
複製代碼

wx.showActionSheet

wx.showActionSheet方法用來顯示操做菜單，在itemList屬性中指定按鈕文案，最大長度爲6。

wx.showActionSheet方法有3種回調方式，分別爲success（選中菜單時）、fail（點擊取消按鈕和背景色）、complete（彈窗收起時），都會傳入結果參數，如{errMsg: "showActionSheet:ok", tapIndex: 0}或{errMsg: "showActionSheet:ok", tapIndex: 0}。

wx.showShareMenu

wx.showShareMenu方法用於顯示當前頁的轉發按鈕，它接受一個withShareTicket參數，爲true時會生成一個分享id，能夠在小程序後臺追蹤分享結果。

wx.showShareMenu({
    withShareTicket: true
  })
複製代碼

wx.getUserInfo

wx.getUserInfo用於獲取用戶信息，能夠在success回調中獲取用戶信息。

wx.getUserInfo({
  success(res) {
    console.log(res)
  }
})
複製代碼

wx.login

wx.login方法與wx.getUserInfo方法不一樣，它的success回調數據中的code屬性是用戶的token，如{errMsg: "login:ok", code: "081qfzoj2LluFC0feOlj2gQboj2qfzo5"}。

token每次請求返回都不一樣，須要將token傳到服務端，由服務端經過code2Session接口獲取到用戶的session_key、openid和unionid，其中是否返回unionid須要看用戶的設置。

code2Session請求地址爲：

GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
複製代碼

其中須要的APPID和SECRET，能夠在小程序的開發設置頁面中找到。

code2Session的返回值中，session_key主要用來驗證用戶身份，請求用戶的信息，用戶每次登陸時，session_key的值都不一樣。

openid是僅在當前小程序中惟一的，當前用戶的id，也就是說openid在其餘小程序中是不一樣的。

unionid指的是開發者的多個公衆號和小程序等應用中，對同一個用戶的惟一標識。developers.weixin.qq.com/miniprogram…

wx.scanCode

wx.scanCode方法是用來調用微信的掃碼功能，可用scanType屬性指定掃碼類型，在success回調中接收掃碼結果。

wx.scanCode({
  scanType: ['barCode', 'qrCode'],
  success(res) {
    console.log(res)  // {errMsg: "scanCode:ok", result: "google", scanType: "QR_CODE", charSet: "UTF-8"}
  }
})
複製代碼

wx.setKeepScreenOn

wx.setKeepScreenOn方法用來使屏幕保持常量狀態，可將keepScreenOn參數設置爲true，開啓保持常量。

wx.setKeepScreenOn({
  setKeepScreenOn: true
})
複製代碼

wx.setScreenBrightness

wx.setScreenBrightness能夠設置屏幕亮度，參數value屬性由0~1表示亮度， 0最暗，1最亮。

wx.setScreenBrightness({
  value: 1
})
複製代碼

wx.getBatteryInfo

wx.getBatteryInfo可用來獲取手機點亮，它還有一個同步版本wx.getBatteryInfoSync，在success回調中能夠獲取數據。

wx.getBatteryInfo({
  success(res) {
    console.log(res)  // {isCharging: false, level: 38, errMsg: "getBatteryInfo:ok"}
  }
})
複製代碼

wx.connectWifi

wx.connectWifi用來連接WIFI，須要傳入WIFI的SSID和password。

wx.connectWifi({
  SSID: '',
  password: '',
  success(res) {
    console.log(res.errMsg)
  }
})
複製代碼

wx.startSoterAuthentication

wx.startSoterAuthentication可用來調用微信的生物認證。可在requestAuthModes中傳入認證方式，目前僅支持fingerPrint指紋識別。challenge挑戰因子屬性用於校驗調用者身份，將做爲 resultJSON 的一部分返回給調用者。

wx.startSoterAuthentication({
  requestAuthModes: ['fingerPrint'],
  challenge: '123456',
  authContent: '請用指紋解鎖',
  success(res) {
    wx.showToast({
      title: JSON.stringify(res),
      icon: 'none'
    })
  },
  fail(res) {
    wx.showToast({
      title: JSON.stringify(res),
      icon: 'none',
      duration: 100000
    })
  },
})
複製代碼

wx.downloadFile

wx.downloadFile將會由客戶端直接發起一個 HTTPS GET 請求，可經過url屬性指定一個下載地址，經過filePath指定下載後的存儲路徑。

wx.downloadFile({
  url: 'https://cn.bing.com/sa/simg/hpc26i_2x.png',
  filePath: 'hpc26i_2x.png',
  success(res) {
    toast(JSON.stringify(res))
  },
  fail(res) {
    toast(JSON.stringify(res))
  },
})
複製代碼

wx.startBluetoothDevicesDiscovery

wx.startBluetoothDevicesDiscovery方法用來搜索附近的藍牙設備，在services屬性中能夠設置要搜索的設備類型。

因爲該方法比較消耗系統資源，搜索並連接成功後能夠調用wx.stopBluetoothDevicesDiscovery關閉搜索。

wx.startBluetoothDevicesDiscovery({
  success(res) {
    toast(JSON.stringify(res))
    wx.stopBluetoothDevicesDiscovery()
  },
  fail(res) {
    toast(JSON.stringify(res))
  },
})
複製代碼

wx.request

wx.request用於網絡請求，注意須要將請求的域名設置爲合法域名，不然請求會被攔截，在測試時能夠在開發工具中選擇不校驗合法域名。

wx.request({
  url: 'https://cn.bing.com/search',
  data: { q: 'abc', safe: 'off' },
  method: 'get',
  dataType: 'text',
  success(res) {
    toast(JSON.stringify(res))
  },
  fail(res) {
    toast(JSON.stringify(res))
  }
})
複製代碼

結束語

至此，微信小程序教程完結，在我看來，小程序更像是Vue+React+React Native的混合體，有Vue或React相關開發經驗的話入門很簡單。

但小程序基於微信平臺，可以實現傳統Web開發不具有的不少功能，並且可以在微信生態圈內發展，做爲前端是不能不掌握的重要技能。