Wechat applets Tutorial 04: API (end)

To read more articles in this series please visit myMaking a blog, sample code please visithere.

The tutorial example code: / lesson04 / pages/index/index, js, / lesson04 / pages/index/index WXML

wx.showLoading

Wx. showLoading is used to display a loading prompt, but it does not provide a duration setting. You need to actively call wx.hideLoading to close the loading prompt, and you can display the loading text through the title property.

wx.showLoading({
  title: 'loading'
})
setTimeout(function () {
  wx.hideLoading()
}, 2000)
Copy the code

wx.showToast

The wx.showToast method is used to display a prompt box, the title property specifies what to display, the icon property specifies the type of icon to display, none indicates no icon, and the duration property sets the duration of the prompt box.

  wx.showToast({
    title: 'toast',
    icon: 'none',
    duration: 1000
  })
Copy the code

wx.showActionSheet

The wx.showActionSheet method is used to display the action menu, specifying the button text in the itemList property. The maximum length is 6.

The wx.showActionSheet method has three callbacks: SUCCESS (when the menu is selected), fail (when the cancel button and the background color are clicked), and complete (when the popover is closed), which pass in the result argument, such as {errMsg: “ShowActionSheet: OK “, tapIndex: 0} or {errMsg: “showActionSheet: OK “, tapIndex: 0}.

wx.showShareMenu

The wx.showShareMenu method is used to display the forward button of the current page. It takes a withShareTicket parameter and, when true, generates a share ID that can be traced in the background of the applet.

  wx.showShareMenu({
    withShareTicket: true
  })
Copy the code

wx.getUserInfo

Wx.getuserinfo is used to get user information, which can be obtained in the SUCCESS callback.

wx.getUserInfo({
  success(res) {
    console.log(res)
  }
})
Copy the code

wx.login

The wx.login method differs from the wx.getUserInfo method in that the code attribute in the success callback data is the user’s token, such as {errMsg: “login: OK “, code: “081 qfzoj2llufc0feolj2gqboj2qfzo5”}.

Token is returned differently for each request. The token needs to be sent to the server, which obtains the session_key, OpenID and UnionID of the user through code2Session interface. Whether to return the unionID depends on the user’s Settings.

Code2Session request address is:

GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
Copy the code

The required APPID and SECRET can be found in the development Settings page of the small program.

In the code2Session return value, session_key is mainly used to authenticate the user and request the user’s information. Each time the user logs in, the session_key value is different.

Openid is the id of the current user that is unique only in the current applet, that is, openID is different in other applet.

Unionid refers to the unique identity of the same user in the developer’s multiple public accounts and mini programs. Developers.weixin.qq.com/miniprogram…

wx.scanCode

The wx.scanCode method is used to call the scan function of wechat. The scanType can be specified by the scanType attribute, and the scan result will be received in the success callback.

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

wx.setKeepScreenOn

The wx.setKeepScreenOn method is used to keep the screen constant. KeepScreenOn can be set to true to enable keepScreenOn.

wx.setKeepScreenOn({
  setKeepScreenOn: true
})
Copy the code

wx.setScreenBrightness

Wx. setScreenBrightness can be set to the brightness of the screen. The value property is 0 to 1. 0 is darkest and 1 is brightest.

wx.setScreenBrightness({
  value: 1
})
Copy the code

wx.getBatteryInfo

Wx.getbatteryinfo can be used to get your phone lit up. There is also a synchronous version of wx.getBatteryInfoSync, which can get the data in the Success callback.

wx.getBatteryInfo({
  success(res) {
    console.log(res)  // {isCharging: false, level: 38, errMsg: "getBatteryInfo:ok"}}})Copy the code

wx.connectWifi

Wx. ConnectWifi is used to connect to WIFI. SSID and password of WIFI need to be passed in.

wx.connectWifi({
  SSID: ' ',
  password: ' ',
  success(res) {
    console.log(res.errMsg)
  }
})
Copy the code

wx.startSoterAuthentication

Wx. StartSoterAuthentication can be used to invoke the WeChat biometric authentication. You can pass authentication modes in requestAuthModes. Currently, only fingerPrint identification is supported. The challenge challenge factor property verifies the identity of the caller and is returned to the caller as part of the resultJSON.

wx.startSoterAuthentication({
  requestAuthModes: ['fingerPrint'],
  challenge: '123456',
  authContent: 'Please unlock it with your fingerprint',
  success(res) {
    wx.showToast({
      title: JSON.stringify(res),
      icon: 'none'
    })
  },
  fail(res) {
    wx.showToast({
      title: JSON.stringify(res),
      icon: 'none',
      duration: 100000
    })
  },
})
Copy the code

wx.downloadFile

Wx. DownloadFile sends an HTTPS GET request directly from the client. You can specify a download address using the URL property and a storage path using 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))
  },
})
Copy the code

wx.startBluetoothDevicesDiscovery

Wx. Near startBluetoothDevicesDiscovery method is used to search the bluetooth device, in the services attributes can be set to search in the device type.

Due to the method of system resources consuming, after the success of the search and link can invoke the wx. StopBluetoothDevicesDiscovery close search.

wx.startBluetoothDevicesDiscovery({
  success(res) {
    toast(JSON.stringify(res))
    wx.stopBluetoothDevicesDiscovery()
  },
  fail(res) {
    toast(JSON.stringify(res))
  },
})
Copy the code

wx.request

Wx. request Is used for network requests. Set the requested domain name to a legitimate domain name; otherwise, the request will be intercepted. During the test, you can choose not to verify the legitimate domain name in the development tool.

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))
  }
})
Copy the code

conclusion

In my view, small programs are more like a hybrid of Vue+React+React Native. It is easy to get started if you have experience in Vue or React development.

However, based on the wechat platform, small programs can realize many functions that traditional Web development does not have, and can develop in the wechat ecosystem. As a front end, it is an important skill to master.