小程序的wx.request的封装

request.js

此方法中已经将请求的数据data和请求头header封装了进去,默认为空

// 封装的wx.request请求
function request(url,method,data={},header={}){
  return new Promise(function(resolve,reject){
    wx.request({
      url: url,
      method: method,
      data:data,
      header:header,
      success:function(res){
        if(res.statusCode == 200){
          resolve(res)
        }else{
          reject('error')
        }
      },
      fail:function(e){
        reject(e)
      }
    })
  })
}

// 封装的请求方法需要暴露出去
module.exports = {
  request: request
}

 用户请求的url,统一放在app.js里面,以方便后期上线或者测试对接口进行修改

 app.js

//app.js
App({
  onLaunch: function () {

  },
  // 全局变量
  globalData: {
    userInfo: null,


  },
  // 用户的信息请求的url
  userUrl:{
    host: "http://op.juhe.cn",


  },

})

 然后在你的页面进行页面请求,以index.js页面为例

//获取应用实例
const app = getApp()
// 封装的接口请求
const request = require('./../../utils/request.js')

Page({
  data: {

  },

  onLoad: function () {
    var that = this;
    // 初始化请求
    that .getuser()
  },

    // 模拟请求

    getuser:function(){

    var uid = '1456765432'

    request.request(app.userUrl.host,'get',{

    uid:uid,

    }).then(res => {

    // 打印接口请求的结果

      console.log(res)

    },e =>{

      console.log(e)

      })

    }

})

  

模拟接口异步请求(链式调用)

function getUserName(){
 let data = 'superman';
 return new Promise((resolve, reject) => {
 setTimeout(resolve(data), 4000);
 })
}
function getUser(username){
 let data = {
 id:1,
 username: 'superman',
 gender: 'male'
 }
 return new Promise((resolve, reject) => {
 if(username){
  setTimeout(resolve(data), 2000);
 }
 else{
  reject('err');
 }
 })
}
getUserName().then(username => {
 return getUser();
})
.then(user => {
 console.log(user);
})
.catch(err => {
 console.log(err);
})