美文网首页
vue2中封装一个axios请求

vue2中封装一个axios请求

作者: 甘道夫老矣 | 来源:发表于2023-12-27 17:04 被阅读0次
import axios from "axios";
import { Message } from "element-ui";

const service = axios.create({
  baseURL: process.env.NODE_ENV !== 'production'?process.env.VUE_APP_BASE_API :process.env.VUE_APP_BASE_API_RUL
});

// request 拦截器
// 可以自请求发送前对请求做一些处理
// 比如统一加token,对请求参数统一加密
service.interceptors.request.use(
  (config) => {
    config.headers["Content-Type"] = "application/json;charset=utf-8";

    config.headers["AUTH_ID"] = JSON.parse(sessionStorage.getItem("AUTH_ID")); // 设置请求头
    return config;
  },
  (error) => {
    return Promise.reject(error);
  }
);

// response 拦截器
// 可以在接口响应后统一处理结果
service.interceptors.response.use(
  (response) => {
    // console.log("-----------response---------------", response);
    let res = response.data;
    // if (res.exception) {
    //   Message.error(exception);
    //   return;
    // }
    // 如果是返回的文件
    if (response.config.responseType === "blob") {
      return res;
    }

    // 兼容服务端返回的字符串数据
    if (typeof res === "string") {
      res = res ? JSON.parse(res) : res;
    }
    return res;
  },
  (error) => {
    Message.error("网络异常,请稍后再试" + error);
    return Promise.reject(error);
  }
);

export default service;

使用

//sever.js
import request from "@/utils/request";
export function collection(params) {
    return request({
        url: "/api/xxxx",
        method: "get",
        params: params,
    });
}

// index.vue
import {
  collection,
} from "@/api/sever.js";
  let params={};
 collection(params).then((res) => {
})

相关文章

网友评论

      本文标题:vue2中封装一个axios请求

      本文链接:https://www.haomeiwen.com/subject/cfthudtx.html