vue3 拦截器 axios

曹え 5811 发布于:2022-04-17 06:06:12

// http.js

import axios from "axios";
import ElementPlus from 'element-plus'
import 'element-plus/lib/theme-chalk/index.css'
import { ElMessage } from 'element-plus'
var service = axios.create({
  baseURL: "https://dbpt.shyouhan.com/",//'http://jsonplaceholder.typicode.com/', // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  timeout: 5000, // request timeout
  responseType: "json",
  headers: {
    Accept: "application/json",
    "Content-Type": "application/json",
    Authorization:
      "Bearer eyJrIjoiZ1BkdjFuVWhpVFJYVDFnNlI4aWVkNjloM3hGSDRUbXkiLCJuIjoidGVzdCIsImlkIjoxfQ=="
  }
});

// 添加请求拦截器
service.interceptors.request.use(
  function(config) {
    // 在发送请求之前做些什么
    return config;
  },
  function(error) {
    // 对请求错误做些什么
	console.log(error)
    return Promise.reject(error);
  }
);

// http response 拦截器
service.interceptors.response.use(
    response => {
        return response;
    },
    error => {
		console.log('nihao',error.response)
        if (error.response) {
            if(error.response.data.errorCode>0){
            	ElMessage({
            	    showClose: true,
            	    message: error.response.data.msg,
            	    type: 'error',
            	  })
            }
        }
        return Promise.reject(error.response.data)   // 返回接口返回的错误信息
    });

// 添加响应拦截器
service.interceptors.response.use(
  function(response) {
    // 对响应数据做点什么
	console.log('nihao2',response)
	if(response.data.errorCode>0){
		ElMessage({
		    showClose: true,
		    message: response.data.msg,
		    type: 'error',
		  })
	}
    return response;
  },
  function(error) {
    // 对响应错误做点什么
	console.log(error)
    return Promise.reject(error);
  }
);

export default service;


api.js 

import fetch from '../util/http'

// post 例子
export function show(data) {
  return fetch({
    url: 'api.php?m=show',
    method: 'post',
	data:data
  })
}

//解密
export function authData(data) {
  return fetch({
    url: 'api/login',
    method: 'post',
	data:data
  })
}

//经销商
export function getDealer(data) {
  return fetch({
    url: 'api/getDealer',
    method: 'post',
	data:data
  })
}

//留资
export function startGroup(data) {
  return fetch({
    url: 'api/startGroup',
    method: 'post',
	data:data
  })
}

// get 例子
export function banner () {
  return ['http://h5.org.cn/images/ban-lb1.jpg','http://h5.org.cn/images/ban-lb2.jpg','http://h5.org.cn/images/ban-lb3.jpg']
}


觉得有用请点个赞吧!
1 966