vue封装请求

request.js文件

import axios from "axios";
import { Message } from "element-ui";
axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";

const service = axios.create({
  baseURL: "/" + process.env.VUE_APP_BASE_API,
});

service.interceptors.request.use(
  (config) => {
    config.headers["client_id"] = "dataexchange";
    config.headers["client_secret"] = "dataexchange";
    config.headers["deviceId"] = "web";
    //获取本地的token值
    const token = window.sessionStorage.getItem("token");
    const token_type = window.sessionStorage.getItem("token_type");
    config.headers["token"] = token;
    if (token_type === null && token === null) {
      config.headers['Authorization']='Basic ZGF0YWV4Y2hhbmdlOmRhdGFleGNoYW5nZQ=='
      // config.headers["Authorization"] = "Basic YXBwOmFwcA==";
    } else {
      config.headers["Authorization"] = token_type + " " + token;
    }
    // get请求映射params参数
    if (config.method === "get" && config.params) {
      let url = config.url + "?";
      for (const propName of Object.keys(config.params)) {
        const value = config.params[propName];
        var part = encodeURIComponent(propName) + "=";
        if (value !== null && typeof value !== "undefined") {
          if (typeof value === "object") {
            for (const key of Object.keys(value)) {
              let params = propName + "[" + key + "]";
              var subPart = encodeURIComponent(params) + "=";
              url += subPart + encodeURIComponent(value[key]) + "&";
            }
          } else {
            url += part + encodeURIComponent(value) + "&";
          }
        }
      }
      url = url.slice(0, -1);
      config.params = {};
      config.url = url;
    }
    return config;
  },
  (error) => {
    Promise.reject(error);
  }
);

service.interceptors.response.use(
  (config) => {
    const res = config;
    return res;
  },
  (error) => {
    if (error.response.status == "401") {
      let { message } = error;
      Message({
        message: "权限失效，请重新登录",
        type: "error",
      });
      sessionStorage.clear();
     
    } else if (error.response.status == "500") {
      let { message } = error;
      Message({
        message: "登录超时，请重新登录",
        type: "error",
      });
      sessionStorage.clear();
      location.href = "http://localhost:1001"
      
    }

    return Promise.reject(error);
  }
);
export default service;

http.js文件 封装请求文件

import service from "./request";

export function post(url, params) {
  return new Promise((resolve, reject) => {
    service
      .post(url, params)
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}
export function postImport(url, params) {
  return new Promise((resolve, reject) => {
    service
      .post(url, params, {
        headers: {
          "Content-Type":
            "multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq",
        },
      })
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

export function putQs(url, params) {
  return new Promise((resolve, reject) => {
    service
      .put(url, params, {
        headers: { "Content-Type": "application/x-www-form-urlencoded" },
      })
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

export function get(url, params) {
  return new Promise((resolve, reject) => {
    service
      .get(url, { params: params })
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

export function del(url, params) {
  return new Promise((resolve, reject) => {
    service
      .delete(url, { params: params })
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

export function put(url, params) {
  return new Promise((resolve, reject) => {
    service
      .put(url, params)
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}
export function upload(url, params) {
  return new Promise((resolve, reject) => {
    service
      .post(url, params, {
        headers: {
          "content-type": "application/octet-stream",
        },
      })
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}
export function patch(url, params) {
  return new Promise((resolve, reject) => {
    service
      .patch(url, params)
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

export function downLoad(url, params) {
  return new Promise((resolve, reject) => {
    service
      .get(
        url,
        { params: params },
        {
          responseType: "arraybuffer",
          headers: {
            "Content-Type": "application/json; application/octet-stream",
          },
        }
      )
      .then(
        (response) => {
          resolve(response.data);
        },
        (err) => {
          reject(err);
        }
      )
      .catch((error) => {
        reject(error);
      });
  });
}

codeApi.js文件 封装请求头

import { get, post, put, del, patch, postQs, putQs } from './http'
import axios from 'axios'
let auth='Basic ZGF0YWV4Y2hhbmdlOmRhdGFleGNoYW5nZQ=='
let http = axios.create({
    baseURL: '/' + process.env.VUE_APP_BASE_API,
    headers:{
        client_id:'dataexchange',
        client_secret:'dataexchange',
        deviceId:'web',
        'Content-Type':'application/json; application/octet-stream',
        token:window.sessionStorage.getItem("token"),

    },
    responseType: 'blob',
  })
  //获取本地的token值
  const token = window.sessionStorage.getItem("token");
  const token_type = window.sessionStorage.getItem("token_type");
  http.interceptors.request.use(
    config => {
        if (token_type === null && token === null) {
            config.headers['Authorization'] = 'Basic ZGF0YWV4Y2hhbmdlOmRhdGFleGNoYW5nZQ=='
        } else {
            config.headers['Authorization'] = token_type + ' ' + token
        }
        return config
    }
)
// 执行完需要调更新json的接口
export const optionData=(params)=>{
    return get('/dd/define/findCacheByCode',params)
}
export function download(fileName){
    return http({
        method:'get',
        url:'/common/download',
        params:{fileName:encodeURI(fileName),delete:true},
        headers:{Authorization:auth}
    })
}
export default http

api.js接口文件
auth-tkn为跨域代理

import { get, post, put, del, patch, postQs, putQs } from '@/api/http'

// token
export function getToken(params) {
    return get('auth-tkn' + '/oauth/token', params)
}
export function goOut(params) {
    return get('auth-tkn' + '/oauth/logout', params)
}