移动端axios二次封装

1.文件夹设置

api为封装的接口、env为环境、request为封装的axios

一、api.js

const {
	request
} = require('./request.js')
//基于业务封装的接口
module.exports = {
	// 登录实名模块
	// 判断是否授权过
	authorizationOrNot: (code) => {
		return request('/wx/ization', 'POST', {
			code: code
		});
	},
}

 二、env.js

//这里使用的接口呢都是自己模拟的，可以根据自己的需求进行添加
module.exports = {
    //开发环境的url
    dev: {
        // baseUrl: "https://www.baidu.com/api",

    },
    //测试环境url
    test: {
        baseUrl: "http://www.test.com"
    },
    //线上环境url
    prod: {
        baseUrl: 'https://api.it120.cc'
    }
}
 

三、request.js

 

// 引入env中的url
const { baseUrl } = require('./env.js').dev; 
//在这里添加我们的专业域名
// const subDomain = 'xxx';

module.exports = {
    /**
     * 二次封装uni.request
     * url:请求的接口地址
     * method:请求方式 GET,POST....
     *  data:要传递的参数
     *isSubDomain:表示是否添加二级子域名 true代表添加, false代表不添加
     */
    request: (url, method, data, ) => {
        // console.log('这是我封装的ajax请求', baseUrl);
          //这里使用ES6的写法拼接的字符串
        let _url = `${baseUrl}${url}`;
        console.log(_url);
        return new Promise((resolve, reject) => {
            // uni.showLoading({
            //     title: '正在加载',
            // });
            uni.request({
                url: _url,
                data: data,
                method: method,
                header: {
                    'content-type': 'application/json' || 'multipart/form-data',
                    'Authorization':uni.getStorageSync('token') ||''
                },
                success: (res) => {
                    // console.log('从接口获取到的数据', res);
                    let { code } = res.data.code;
                    if(code===200) {
                        resolve(res.data);
                        // uni.hideLoading();
                    }else {
                        // uni.showToast({
                        //     title: res.data.msg,
                        // })
                        resolve(res.data);
                    }
                },
                fail() {
                    reject('接口有误，请检查')
                }
            });
            
        });
    },
}

四、页面使用

const { editMessageStatus, getAllMessage } = require('@/http/api.js');