微信小程序封装http请求

微信小程序封装http请求

话不多说直接上代码:(/utils/http.js )

import {
config
} from '../config.js'

class HTTP {
request({
url,
data = {},
method = 'GET',
header = {}
}) {

return new Promise((resolve, reject) => {
this._request(url, resolve, reject, data, method, header)
})
}
_request(url, resolve, reject, data, method, header) {
wx.request({
url: config.api_url + url,
method: method,
data: data,
header: Object.assign(config.header, header),
success: (res) => {
const code = res.statusCode.toString()
if (code.startsWith('2') || code === '200') {
resolve(res.data)
} else {
this._show_error(res.code)
}
},
fail: (err) => {
reject()
this._show_error(1)
}
})
}

// 私有方法
_show_error(error_code) {
if (!error_code) {
error_code = 1
}
const tip = config.tips[error_code]
wx.showToast({
title: tip ? tip : config.tips[1],
icon: 'none',
duration: 1300
})
}
}

export {
HTTP
}

使用方法:

import{ HTTP } from "../../utils/http.js"

const http = new HTTP();

image.png

http.request({
url: '/test',
method: 'POST',
data: {
'id': 1,
}
})
.then(res=>{
console.log(res);
})

image.png

请求结果:

config中代码:

const config = {
api_url: 'http://www.aaa.com/api',
header: {
'content-type': 'application/json',
},
tips: {
1: '请求出错了',
429: '请求频繁',
},

}

export { config }

这样就可以了!  如果感觉请求都在页面js中不合适,可以单独封装到一个model文件中~  

微信小程序封装http请求


喜欢(0)

评论 抢沙发

表情