httputils.js
1.请求头少不了
1 /** 2 * 请求头 3 */ 4 var header = { 5 \'content-type\': \'application/x-www-form-urlencoded\', 6 \'Authorization\': "Bearer " + wx.getStorageSync("token"), 7 \'os\': \'android\', 8 \'version\': \'1.0.0\', 9 }
值得注意的是content-type\': \'application/json
,死活不行,必须content-type\': \'application/x-www-form-urlencoded
。
大家使用的时候,注意这点,反正我被坑了很久。坐等你入坑
2.请求参数少不了
1 /** 2 * function: 根据需求处理请求参数:添加固定参数配置等 3 * @params 请求参数 4 */ 5 function dealParams(params) { 6 console.log("请求参数:", params) 7 return params; 8 }
3.get请求
function get(url, params, onSuccess, onFailed) { console.log("请求方式:", "GET") request(url, params, "GET", onSuccess, onFailed); }
4 .post请求
/** * 供外部post请求调用 */ function post(url, params, onSuccess, onFailed) { console.log("请求方式:", "POST") request(url, params, "POST", onSuccess, onFailed); }
5.request请求方法
1 /** 2 * function: 封装网络请求 3 * @url URL地址 4 * @params 请求参数 5 * @method 请求方式:GET/POST 6 * @onSuccess 成功回调 7 * @onFailed 失败回调 8 */ 9 10 function request(url, params, method, onSuccess, onFailed) { 11 console.log(\'请求url:\' + url); 12 wx.showLoading({ 13 title: "正在加载中...", 14 }) 15 console.log("请求头:", header) 16 wx.request({ 17 url: url, 18 data: dealParams(params), 19 method: method, 20 header: header, 21 success: function(res) { 22 wx.hideLoading(); 23 console.log(\'响应:\', res.data); 24 25 if (res.data) { 26 /** start 根据需求 接口的返回状态码进行处理 */ 27 if (res.statusCode == 200) { 28 onSuccess(res.data); //request success 29 } else { 30 onFailed(res.data.message); //request failed 31 } 32 /** end 处理结束*/ 33 } 34 }, 35 fail: function(error) { 36 onFailed(""); //failure for other reasons 37 } 38 }) 39 }
最终的httputils.js
1 /** 2 * 请求头 3 */ 4 var header = { 5 \'content-type\': \'application/x-www-form-urlencoded\', 6 \'Authorization\': "Bearer " + wx.getStorageSync("token"), 7 \'os\': \'android\', 8 \'version\': \'1.0.0\', 9 \'device_token\': \'ebc9f523e570ef14\', 10 } 11 12 /** 13 * 供外部post请求调用 14 */ 15 function post(url, params, onSuccess, onFailed) { 16 console.log("请求方式:", "POST") 17 request(url, params, "POST", onSuccess, onFailed); 18 19 } 20 21 /** 22 * 供外部get请求调用 23 */ 24 function get(url, params, onSuccess, onFailed) { 25 console.log("请求方式:", "GET") 26 request(url, params, "GET", onSuccess, onFailed); 27 } 28 29 /** 30 * function: 封装网络请求 31 * @url URL地址 32 * @params 请求参数 33 * @method 请求方式:GET/POST 34 * @onSuccess 成功回调 35 * @onFailed 失败回调 36 */ 37 38 function request(url, params, method, onSuccess, onFailed) { 39 console.log(\'请求url:\' + url); 40 wx.showLoading({ 41 title: "正在加载中...", 42 }) 43 console.log("请求头:", header) 44 wx.request({ 45 url: url, 46 data: dealParams(params), 47 method: method, 48 header: header, 49 success: function(res) { 50 wx.hideLoading(); 51 console.log(\'响应:\', res.data); 52 53 if (res.data) { 54 /** start 根据需求 接口的返回状态码进行处理 */ 55 if (res.statusCode == 200) { 56 onSuccess(res.data); //request success 57 } else { 58 onFailed(res.data.message); //request failed 59 } 60 /** end 处理结束*/ 61 } 62 }, 63 fail: function(error) { 64 onFailed(""); //failure for other reasons 65 } 66 }) 67 } 68 69 /** 70 * function: 根据需求处理请求参数:添加固定参数配置等 71 * @params 请求参数 72 */ 73 function dealParams(params) { 74 console.log("请求参数:", params) 75 return params; 76 } 77 78 79 // 1.通过module.exports方式提供给外部调用 80 module.exports = { 81 postRequest: post, 82 getRequest: get, 83 }
写好httputils.js
后,一定要通过module.exports
给外部使用
使用:
1.在需要js的页面,引入httputils.js
var http = require(\'../../httputils.js\'); //相对路径
2.调用
var prams = { username: "1111", password:"123456" } http.postRequest("https://www.baidu.com", prams, function(res) { }, function(err) { })
效果图