تفاوت axios با Fetch

[ali]

سلام به همگی
Fetch با axios
چه فرقی داره…

[hadi]

فتچ به صورت دیفالت قابل دسترسه اما اکسیوس به صورت پکیج نصب میشه
فتچ رو نمیتونی توی ssr استفاده کنی ولی اکسیوس رو میتونی
یه سری اپش های دیگه هم اکسیوس داره که به شخصه اکسیوس رو ترجیح میدم

[مهدی حسن زاده]

به طوری کلی یک سری تفاوت ها دارند
به طور مثال در axios شما می توانید مدت زمان پاسخگویی را مشخص کنید
axios({
method: ‘post’,
url: ‘/login’,
timeout: 4000, // 4 seconds timeout
data: {
firstName: ‘David’,
lastName: ‘Pollock’
}
})
.then(response => {/* handle the response */})
.catch(error => console.error(‘timeout exceeded’))

در fetch مدت زمان پاسخگویی رو باید از طریق AbortController مشخص کنید
const controller = new AbortController();
const options = {
method: ‘POST’,
signal: controller.signal,
body: JSON.stringify({
firstName: ‘David’,
lastName: ‘Pollock’
})
};
const promise = fetch(‘/login’, options);
const timeoutId = setTimeout(() => controller.abort(), 4000);
promise
.then(response => {/* handle the response */})
.catch(error => console.error(‘timeout exceeded’));

در axios داده های برگشتی از سمت سرور به طور خودکار تبدیل به json می شوند ولی در fetch شما باید بیاین خودتون تبدیل رو انجام بدید
در axios شما خیلی راحت می تونید چندین درخواست همزمان داشته باشید
axios.all([
axios.get(‘https://api.github.com/users/iliakan’),
axios.get(‘https://api.github.com/users/taylorotwell’)
])
.then(axios.spread((obj1, obj2) => {
// Both requests are now complete
console.log(obj1.data.login + ‘ has ‘ + obj1.data.public_repos + ‘ public repos on GitHub’);
console.log(obj2.data.login + ‘ has ‘ + obj2.data.public_repos + ‘ public repos on GitHub’);
}));
ولی در fetch برای چندین درخواست همزمان باید از Promise استفاده کنید
Promise.all([
fetch(‘https://api.github.com/users/iliakan’),
fetch(‘https://api.github.com/users/taylorotwell’)
])
.then(async([res1, res2]) => {
const a = await res1.json();
const b = await res2.json();
console.log(a.login + ‘ has ‘ + a.public_repos + ‘ public repos on GitHub’);
console.log(b.login + ‘ has ‘ + b.public_repos + ‘ public repos on GitHub’);
})
.catch(error => {
console.log(error);
});

به طور کلی میشه گفت axios از fetch راحت تر و امکانات و پیکیربندی های بیشتری را در اختیار شما قرار می دهد

[نویسنده]

نوشته‌ها