微信小程序网络请求封装

在根目录新建utils文件夹，新建request.js文件

export default class request {
  constructor() {
    // 后台地址
    const baseApi = {
      // 开发版
      develop: 'http://****/',
      // 体验版
      trial: 'https://****/',
      // 正式版
      release: 'https://****/'
    }

    // 上传文件路径
    const basePath = {
      // 开发版
      develop: '\\****\\****\\',
      // 体验版
      trial: '\\****\\****\\',
      // 正式版
      release: '/****/****/'
    }
    // __wxConfig.envVersion wx的api可以获取版本信息
    this.localStation = baseApi[__wxConfig.envVersion]
    this.uploadPath = basePath[__wxConfig.envVersion]
  }

  /** GET类型的网络请求 */
  getRequest(url, data) {
    return this.requestAll(url, data, 'GET')
  }

  /** DELETE类型的网络请求 */
  deleteRequest(url, data) {
    return this.requestAll(url, data, 'DELETE')
  }

  /** PUT类型的网络请求 */
  putRequest(url, data) {
    return this.requestAll(url, data, 'PUT')
  }

  /** POST类型的网络请求 */
  postRequest(url, data) {
    return this.requestAll(url, data, 'POST')
  }

  /** 网络请求 */
  requestAll(url, data, method) {
    return new Promise((resolve, reject) => {
      wx.request({
        url: this.localStation + url,
        data: data,
        header: {
        // 根据自己业务需求
          'Authorization': 'Bearer ' + wx.getStorageSync('userInfo').token,
          'token': wx.getStorageSync('userInfo').token
        },
        method: method,
        success: (res => {
          if (res.statusCode === 200) {
            //200: 服务端业务处理正常结束
            resolve(res)
          } else {
            //其它错误，提示用户错误信息
            reject(res)
          }
        }),
        fail: (res => {
          reject(res)
        })
      })
    })
  }
}

在app.js里引用

import request from './utils/request'
App({
 onLaunch() {
      this.login()
    },
  wxRequest() {
      return new request()
    },
  login() {
      wx.login({
        success: res => {
          this.wxRequest().postRequest('登录接口', {
            code: res.code
          }).then(res => {
            if (res.data.code !== 0) {
                 失败操作
              return
            }
            // 储存游客信息
            wx.setStorageSync('userInfo', res.data.data)
          }).catch(err => {
            console.log(err)
          })
        },
        fail: err => {
          console.log(err)
        }
      })
    },
  }
})

使用 在页面的js中

const http = getApp().wxRequest()
Page({
  data: {
      list: [],
      dataForm:{}
  },
  onLoad() {
  /** 获取list */
  getMissionInfoList() {
    http.getRequest('获取列表接口', dataForm).then(res => {
      if (res.data.code !== 0) {
        return
      }
      this.setData({
        list: res.data.data
      })
    }).catch(err => {
      console.log(err)
    })
  }
})