php从0到1开发,自学微信小程序从零到一：项目构建后http请求封装

一、http模块分装

首先我们为什么要去分装微信的http模块呢，我们先看一下微信自带的http请求它的一个写法wx.request({

url: 'test.php', //仅为示例，并非真实的接口地址

data: {

x: '',

y: ''

},

header: { 'content-type': 'application/json' // 默认值

},

success (res) {

console.log(res.data)

}

})

这种请求方式呢类似我们古老的jquery方式的分装，我们需要在success的回调函数里面做一些业务操作，这种方式会形成我们的回调地狱问题，同时代码也不够直观，以及代码过于繁琐；

接下来我会通过promise的这种方式对于代码进行分装，将请求方式做一些简化

一、项目目录构建

在utils目录下边创建request.js文件，去做http请求封装，我们是通过promise这种方式进行封装，这样有利于我们对于错误的处理，也可以很直观的查看业务逻辑，封装示例代码如下：/**

*

* @param {String} url

* @param {Object} data

* @param {String} method

* @param {String} header

*/

function request(url, data={}, method='GET', header="Content-Type: application/json",) {

return new Promise(function (resolve, reject) {

wx.request({

url: url,

data: data,

header: header,

method: method,

dataType: 'json',

responseType: 'text',

success: (res)=>{

if(res.statusCode === 200) {

if (res.data.code === 200) {

resolve(res.data)

} else {

wx.showToast({

title: res.data.msg,

icon: 'none',

image: '',

duration: 1500,

mask: false,

success: (result)=>{

resolve(res.data);

},

});

}

} else {

}

},

fail: (res)=>{

// 需要我们加上统一的错误处理代码

reject(res)

},

complete: ()=>{}

});

})

}

// 封装方法

// 如果对于header有什么特殊的要求，可以在请求参数里面做一些添加，例如后续我们会在headder中加入我们的sessionkey这些内容

// header = {}里面添加header内容

// 这块是一个简版的说明

const header = {

"Content-Type": "application/json",

// 这个token是微信登录以后，将token存入在缓存中

"token": "*****************"

}

const get = function(url, data, header) {

return request(url, data, 'GET', header);

}

const post = function(url, data, header) {

return request(url, data, 'POST', header);

}

const del = function(url, data, header) {

return request(url, data, '', header);

}

module.exports = {

get,

post,

del,

}

二、项目中请求的使用

首先我们在使用的位置引入我们封装好的http模块import webHttp from './utils/request';

接下里我们可以使用我们封装好的webhttp工具，比之前直接用微信的request请求方式代码量降低，同时链式方式使得逻辑更加清晰webHttp.get(api.user.info, {

// nick_name:

...self.globalData.userInfo

}).then((res) => {

console.log(res);

})

大概上是这样的一个过程，实际过程中可能根据后端restful api的方式需要对封装继续完善，同样是对于post请求的data参数也有不同的处理，这个需要按照实际情况做出相应的调整，如果本篇文章有帮助到你，欢迎收藏点赞，同样有什么地方有更好的方式欢迎交流，进步永不停息

推荐教程：《微信小程序》