微信小程序封装request请求

最近在做小程序项目，就想封装一个便于管理的接口地址的请求，百度了很久，发现很多前辈提供的轮子都不适合我。

所以自己来造了这个轮子，只需要在文件中声明请求方式和请求地址即可，在后期管理接口和使用起来会非常方便。

1、创建api.js文件，封装wx.request请求

// import apiList from './apiList' // 使用import引入会报错Unexpected identifier，所以改用require
const host = require('./apiList').host; // 引入host地址
const apiList = require('./apiList').apiList; // 引入接口列表

const apiRequest = (url, method, data, header) => { // apiRequest方法接收wx.request所需要的参数，如果不够还可以自己添加参数
  let promise = new Promise(function (resolve, reject) {
    wx.request({
      url: host + url,
      data: data || null,
      method: method,
      header: header || { 'content-type':'application/x-www-form-urlencoded' },
      success: function (res) {
        // 接口调用成功
        resolve(res); // 根据业务需要resolve接口返回的json的数据
      },
      fail: function (res) {
        // 接口调用失败
        reject({ errormsg: '网络错误,请稍后重试', code: -1 });
      }
    })
  });
  return promise;  // 注意，这里返回的是promise对象
}

var list = {};
for(item in apiList) {
  list[item] = {
    index: item,
    http(data) {
      return new Promise((resolve, reject) => {
        resolve (apiRequest(apiList[this.index][1], apiList[this.index][0], data))
      })
    }
  };
}

// 使用export default导出会报错Unexpected token export，所以改用module.exports
// export default {
//   login, register
// }
module.exports = list; // 最后将这个对象导出，给其他页面调用

2、创建apiList.js文件，用来管理请求地址

// 设置API接口的ip地址和端口
let host = 'http://192.168.0.122:83/'

// 所有接口列表
let apiList = {
    login: ['post', 'user/login'],
    register: ['get', 'user/register']
}

// 将host和apiList导出
module.exports = {
    host, apiList
}

3、在页面中调用请求

var api = require('../../utils/api.js'); // 需要先引入封装文件

Page({
  onLoad() {
    api.login.http({username: "barben", password: "23333333"}).then(res => {
        console.log(res);
    })
    api.register.http().then(res => {
        console.log(res);
    })
  }
})