前言：

刚开始做小程序的时候，做网络请求接口调用的时候，都是用小程序原生网络请求API，但是做多了以后，特别是发现页面请求接口比较多的时候，会发现代码会显得很臃肿，于是觉得时候要抽取一下网络请求这一块的代码了，发现做完了还挺实用。由于本人是做iOS开发的，小程序这块不是很熟，如果有误导小伙伴们的地方，还望指正。

由于微信小程序的所有网络请求都是异步请求，如果页面有多个网络请求之间存在依赖的时候，必然就会发生嵌套，说到这里就得好好学习一下promise的知识了，这一部分看的是廖大神写的了，比较简单易懂。

话不多说，开始上代码了：

代码块 wxRequest.js

//引入Promise
var Promise = require('./es6-promise.auto.js');
//获取服务器地址
var servser = getApp().globalData.baseURL; 
console.log('服务器地址：',servser);

//post请求
function postRequest(url, params) {
  let promise = new Promise(function (resolve, reject) {
    wx.request({
        url: servser + url,
        data: params,
        method: 'POST',
        header: {
          'content-type': 'application/json'
        },
        success: function (result) {
          // 请求成功
          // console.log('请求结果:',result)
          resolve(result);
        },fail:function(result) {
         //请求失败
          reject(result)
        }
      });
  });
  return promise;
}

//get请求
function getRequest(url) {

  let promise = new Promise(function (resolve, reject) {
      wx.request({
        url: servser + url,
        method: 'GET',
        header: {
          'content-type': 'application/json'
        },
        success: function (result) {
          // console.log('请求结果:', result)
          resolve(result);
        },fail: function (result) {
         // 请求失败
         reject(result)
        }
      });
  });
  return promise;
}


//暴露外部访问接口
module.exports = {
  postRequest: postRequest,
  getRequest: getRequest,
}

接下来在js页面调用起来就非常方便了，在此之前别忘了要引用一下wxRequest.js

CODE.png

const wxRequest = require('../../utils/wxRequest.js');

调用get封装方法

    wxRequest.getRequest(url).then(result => {
      console.log('用户数据:')
      console.log(result.data)
    })   

调用post封装方法

    wxRequest.postRequest(url, params).then(result => {
      console.log('用户数据:')
      console.log(result.data)
    })   

如果对和我一样刚做小程序不久的小伙伴有用的话，别忘了给个赞哈！