Encapsulation and improvement of WeChat applet network requests

The Content-Type in the header must be in lower case for the server to receive parameters. It took me a long time to make it difficult to change the server. it turned out to be a problem. In requestpayload, the server cannot receive the parameter. after the following conversion is used, the server first declares a bug in the mini-program document. as a result, the server cannot receive the parameter during the request.

Sample code:

Wx. request ({url: 'Test. php ', // only for example. it is not the actual interface address data: {x: '', y:''}, header: {'content-type ': 'application/json'}, success: function (res) {console. log (res. data )}})

The Content-Type in the header must be in lower case for the server to receive parameters. It took me a long time to make it difficult to change the server. it turned out to be a problem. The request payload parameter cannot be received by the server.

function json2Form(json) { var str = []; for(var p in json){ str.push(encodeURIComponent(p) + "=" + encodeURIComponent(json[p])); } return str.join("&");}

In the end, we still think it is the content-type problem. In the end, I changed my mind to OK. I felt that such a great team had made a very low-level mistake, and I had to make great strides for developers. Do not mention the code.

1. Http request class

Import util from 'util. js';/*** url request address * successful callback of success * failed callback of fail */function _ get (url, success, fail) {console. log ("------ start --- _ get ----"); wx. request ({url: url, header: {// 'content-type': 'application/json'}, success: function (res) {success (res );}, fail: function (res) {fail (res) ;}}); console. log ("---- end ----- _ get ----");}/*** url request address * successful callback of success * failed callback of fail */function _ post_from (url, data, success, fail) {console. log ("---- _ post -- start -------"); wx. request ({url: url, header: {'content-type': 'application/x-www-form-urlencoded',}, method: 'post', data: {data: data}, success: function (res) {success (res) ;}, fail: function (res) {fail (res) ;}}); console. log ("---- end ----- _ get ----");}/*** url request address * successful callback of success * failed callback of fail */function _ post_json (url, data, success, fail) {console. log ("---- _ post -- start -------"); wx. request ({url: url, header: {'content-type': 'application/json',}, method: 'post', data: data, success: function (res) {success (res) ;}, fail: function (res) {fail (res) ;}}); console. log ("---- end ---- _ post -----");} module. exports = {_ get: _ get, _ post: _ post, _ post_json: _ post_json}

Test cases

2.1 get request

// GET mode let map = new Map (); map. set ('receiveid', '000000'); let d = json_util.mapToJson (util. tokenAndKo (map); console. log (d); var url1 = api. getBaseUrl () + 'searchtaskbyreceiveid? Data = '+ d; network_util. _ get (url1, d, function (res) {console. log (res); that. setData ({taskEntrys: res. data. taskEntrys}) ;}, function (res) {console. log (res );});

2.2 POST request

// Let map = new Map (); map in Post mode. set ('receiveid', '000000'); let d = json_util.mapToJson (util. tokenAndKo (map); console. log (d); var url1 = api. getBaseUrl () + 'searchtaskbyreceiveid'; network_util. _ post (url1, d, function (res) {console. log (res); that. setData ({taskEntrys: res. data. taskEntrys}) ;}, function (res) {console. log (res );});

Effect

The above is the details of encapsulation and improvement of small program network requests. For more information, see other related articles in the first PHP community!