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) { })
效果图
