在微信小程序中封装请求文件通常涉及以下几个步骤:
创建环境配置文件:
在项目根目录下创建一个`env.js`文件,用于存储不同环境下的公共接口地址,如开发环境、测试环境和生产环境的接口地址。
封装请求方法:
在项目根目录下创建一个`request.js`文件,用于封装请求方法。在这个文件中,你可以定义一个函数,该函数接收请求的URL、请求方法、请求参数以及是否需要使用专属域名等信息,并返回一个Promise对象,以便于处理异步请求。
引入环境变量:
在需要使用请求方法的页面中,引入`env.js`文件,以便获取当前环境下的接口地址。
使用封装的请求方法:
在页面的`js`文件中,调用封装好的请求方法,传入相应的参数,即可发起网络请求。
下面是一个简单的示例,展示了如何封装请求文件:
env.js
```javascript
module.exports = {
// 开发环境
dev: {
baseUrl: 'http://localhost:3000'
},
// 测试环境
test: {
baseUrl: 'www.test.com'
},
// 线上环境
prod: {
baseUrl: 'https://api.it120.cc'
}
};
```
request.js
```javascript
const { baseUrl } = require('./env.js').prod;
const request = (url, method = 'GET', data = {}, isSubDomain = true) => {
let fullUrl = `${baseUrl}/${isSubDomain ? '专属域名' : ''}/${url}`;
return new Promise((resolve, reject) => {
wx.request({
url: fullUrl,
method: method,
data: data,
success: res => resolve(res),
fail: err => reject(err)
});
});
};
module.exports = {
request: request
};
```
在页面中使用封装的请求方法
```javascript
const { request } = require('./request.js');
Page({
onLoad: function () {
request('/shop/goods/list', 'POST', {}, true)
.then(res => {
console.log(res.data);
})
.catch(err => {
console.error(err);
});
}
});
```
通过上述步骤,你可以将微信小程序中的请求进行封装,使得代码更加简洁、易于维护,并且方便进行环境切换。