Axios拦截器中的
我需要为所有axios调用设置一个全局拦截器。我在vuex操作中定义了它们，如果有429状态代码，我需要调用一个操作，然后在执行完这些操作后，对原始请求进行重试。我正在学习拦截器，但我不知道如何正确设置它，也不知道它是否能在export default之外工作。有人能帮我吗？
axios.interceptors.use( (response) => {
// if no status error code is returned get the response
return response
}, (error) => {
console.log(error)
// here I need to retry the ajax call after that my loadProxy action is made and a 429 status code is sent from the server
return Promise.reject(error);
})
export default new Vuex.Store({
actions: {
loadProxy({ commit }) {
// here I have an axios get request to fetch a proxy from an API
},
fetchData({ commit, state }) {
// here I fetch the data to use in my app, sometimes due to many requests I need to refresh the proxy ip to let the app continue working
}
}
})
response对象包含一个config对象。(参见此处(
您可以使用它以原始配置重新启动请求。
一个例子：
axios.interceptors.response.use((response) => {
return response;
}, (error) => {
if (error.response.status === 429) {
// If the error has status code 429, retry the request
return axios.request(error.config);
}
return Promise.reject(error);
});
要在拦截器回调中使用Vuex操作，可以首先将存储定义为变量，然后在回调中调用调度函数。像这样：
const store = new Vuex.Store({
// define store...
})
axios.interceptors.response.use((response) => {
return response;
}, (error) => {
if (error.response.status === 429) {
store.dispatch("YOUR_ACTION");
return axios.request(error.config);
}
return Promise.reject(error);
});
export default store;
你可以用axios重试进行实验，有一个选项
retryCondition：回调以进一步控制是否应重试请求
import axiosRetry from "axios-retry"
// ...
// intercept
axiosRetry(axios, {
retries: 3,
retryCondition: (error) => {
return error.response.status === 429
},
})