如何注册Axios instance 和 拦截器 然后全局使用

axios官方文档
在这里分享给大家，希望能帮助到大家。
首先注册一个api.js文件

  				import axios from "axios";
                  const api = axios.create({
                    baseURL: 'https://picsum.photos/v2/list?page=2&limit=10',
                    headers: {
                      Accept: "application/json",
                      "Content-Type": "application/json"
                    }
                  });
                  api.defaults.timeout = 10000;

                  api.interceptors.request.use(
                    config => {
                      const token = localStorage.getItem("access_token");
                      if (token) {
                        api.defaults.headers.common["Authorization"] = "Bearer " + token;
                      }
                      return config;
                    },
                    error => Promise.reject(error)
                  );
                  let isRefreshing = true;
                  api.interceptors.response.use(
                    response => {
                      if (response.status === 200 || response.status === 201) {
                        return Promise.resolve(response);
                      } else {
                        return Promise.reject(response);
                      }
                    },

                    error => {
                      if (error.response.status) {
                        switch (error.response.status) {
                          case 401:
                            if (!error.request.responseURL.includes("api/token/")) {
                              if (isRefreshing) {
                                const refresh = JSON.stringify({
                                  refresh: window.localStorage.getItem("refresh_token")
                                });
                                store.dispatch("requestRefresh", refresh);
                              }
                              isRefreshing = false;

                              window.localStorage.removeItem("access_token");
                            } else {
                              throw error;
                            }

                            break;

                          case 403:
                            router.replace({
                              path: "/login",
                              query: { redirect: router.currentRoute.fullPath }
                            });
                            break;
                          case 404:
                            throw error;

                          default:
                            throw error;
                        }
                        return Promise.reject(error.response);
                      }
                    }
                  );

                  export default api;
  

api.js相当于你的基础url,你可以在全局使用这个url。前提是你需要import api.js到你想要使用axios的地方。 然后我就可以使用api.post(’/…’).then(…)

方法2 vue $http

Vue.use({
  install (Vue) {
  Vue.prototype.$http = axios.create({
    baseURL: '/'
  })
}
})

覆盖了vue原型的http方法，然后就可以全局使用this.$http进行axios的请求了