49 lines
1.5 KiB
TypeScript
49 lines
1.5 KiB
TypeScript
import { defineBoot } from '#q-app/wrappers'
|
||
import axios, { type AxiosInstance } from 'axios'
|
||
import { useAuthStore } from 'src/stores/auth'
|
||
|
||
declare module 'vue' {
|
||
interface ComponentCustomProperties {
|
||
$axios: AxiosInstance;
|
||
$api: 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: '/',
|
||
withCredentials: true // Важно для работы с cookies
|
||
})
|
||
|
||
api.interceptors.response.use(
|
||
response => response,
|
||
async error => {
|
||
if (error.response?.status === 401) {
|
||
const authStore = useAuthStore()
|
||
await authStore.logout()
|
||
}
|
||
console.error(error)
|
||
return Promise.reject(new Error())
|
||
}
|
||
|
||
)
|
||
|
||
export default defineBoot(({ 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 };
|