Detailed explanation of WeChat applet request network request operation example

小云云
Release: 2017-12-18 09:26:03
Original
1935 people have browsed it

The mini program provides many APIs, which greatly facilitates developers. Among them, the network request API iswx.request(object), which is the one that implements data interaction between the mini program and the developer's server. Very important API. This article mainly introduces the WeChat applet's use of the request network request operation, and analyzes the specific usage skills of the wx.request(object) network request operation in the form of examples. Friends in need can refer to it. I hope it can help everyone.

The official parameter description is as follows

OBJECT parameter description:

##Parameter name Type Required Description
url String is Developer server interface address
data Object、String No Request parameters
header Object No Set the request header, Referer cannot be set in the header
method String No Default is GET, valid values: OPTIONS, GET, HEAD, POST, PUT , DELETE, TRACE, CONNECT
success Function No Receive the callback function successfully returned by the developer service, res = {data: 'Content returned by the developer server'}
fail Function No Callback for failed interface call Function
complete Function No The callback function at the end of the interface call (will be executed if the call is successful or failed)
The simplest usage is as follows (take POST request as Example)


bindSearchChange:function(e){ var keyword = e.detail.value; wx.request({ url:'xxxxxxxxx', data:{}, header: {'Content-Type': 'application/json'}, success: function(res) { console.log(res) } }) }
Copy after login

Below we write the request in the http.js file under the service file, the code is as follows


var rootDocment = 'hxxxxx';//你的域名 function req(url,data,cb){ wx.request({ url: rootDocment + url, data: data, method: 'post', header: {'Content-Type': 'application/json'}, success: function(res){ return typeof cb == "function" && cb(res.data) }, fail: function(){ return typeof cb == "function" && cb(false) } }) } module.exports = { req: req }
Copy after login

module.exportsexposes the req method so that it can be used in other files. Since the js function is executed asynchronously, the return function is the callback function, not the specific data

In order to facilitate other files to call this method, we register it as a global function in the app.js file in the root directory, as follows


//app.js var http = require('service/http.js') App({ onLaunch: function () { //调用API从本地缓存中获取数据 var logs = wx.getStorageSync('logs') || [] logs.unshift(Date.now()) wx.setStorageSync('logs', logs) }, 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 }, func:{ req:http.req } })
Copy after login

At this time, this req It is global. When calling, we can use

getApp.func.req()to call. The details are as follows


var app = getApp() Page({ data: { }, onLoad: function (opt) { //console.log(opt.name) app.func.req('/api/get_data',{},function(res){ console.log(res) }); } })
Copy after login

WeChat applet provides Many APIs, including network, media, data, etc., also provide many components, making it very convenient to develop small programs.

Related recommendations:

Summary of functions of WeChat mini program

Tutorial on implementing the function of adding mobile phone contacts to WeChat mini program

How to implement the WeChat applet display drop-down list function

The above is the detailed content of Detailed explanation of WeChat applet request network request operation example. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!