封装axios请求

1.新建request.js文件,封装axios请求

import axios from 'axios';

const instance = axios.create({
	baseURL: 'https://XXXX'    //接口url前缀
});

//请求拦截处理
instance.interceptors.request.use(async function (config) {
	config.headers.common.Authorization = "XXXXXXXX";  //为请求头加上token
	return config;
	// 在发送请求之前做些什么
}, function (error) {
	// 对请求错误做些什么
	return Promise.reject(error);
});


//响应拦截处理
instance.interceptors.response.use(function (response) {
	// 对响应数据做点什么
	return response;
}, function (error) {
	// 对响应错误做点什么
	return Promise.reject(error);
});

class http {
	//get请求
	static get(api, params) {
		return new Promise((resolve, reject) => {
			instance.get(api, {params})
			.then(res => {
					resolve(res.data)
			})
			.catch(error => {
					reject(error)
			})
		})
	}

	//post请求
	static post(api, params) {
		return new Promise((resolve, reject) => {
			instance.post(api, params)
			.then(res => {
					resolve(res.data)
			})
			.catch(error => {
					reject(error)
			})
		})
	}
}

//导出http模块
export {http}

2.在页面中导入封装文件

import {http} from './api/request'

3.在页面中使用axios请求接口

try{
	await http.post('/login',{
		[accountType]: this.state.username,
		password: this.state.password,
	})       
}catch(error){
	this.setState({
		errorMsg: error.response.data.message
	})
}

猜你喜欢

转载自blog.csdn.net/marsur/article/details/103598304