49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import { boot } from 'quasar/wrappers';
|
|
import axios, { AxiosInstance } from 'axios';
|
|
|
|
import { useSession } from 'src/composables/useSession';
|
|
const { getToken } = useSession();
|
|
|
|
declare module '@vue/runtime-core' {
|
|
interface ComponentCustomProperties {
|
|
$axios: AxiosInstance;
|
|
}
|
|
}
|
|
|
|
// Be careful when using SSR for cross-request state pollution
|
|
// due to creating a Singleton instance here;
|
|
// If any client changes this (global) instance, it might be a
|
|
// good idea to move this instance creation inside of the
|
|
// "export default () => {}" function below (which runs individually
|
|
// for each client)
|
|
const api = axios.create({ baseURL: 'https://api.example.com' });
|
|
|
|
axios.interceptors.request.use(
|
|
function (context) {
|
|
const token = getToken();
|
|
|
|
if (token.length && context.headers) {
|
|
context.headers.Authorization = token;
|
|
}
|
|
|
|
return context;
|
|
},
|
|
function (error) {
|
|
return Promise.reject(error);
|
|
}
|
|
);
|
|
|
|
export default boot(({ app }) => {
|
|
// for use inside Vue files (Options API) through this.$axios and this.$api
|
|
|
|
app.config.globalProperties.$axios = axios;
|
|
// ^ ^ ^ this will allow you to use this.$axios (for Vue Options API form)
|
|
// so you won't necessarily have to import axios in each vue file
|
|
|
|
app.config.globalProperties.$api = api;
|
|
// ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
|
|
// so you can easily perform requests against your app's API
|
|
});
|
|
|
|
export { api };
|