Fetch API — ժամանակակից Promise-հիմնված մեթոդ HTTP request-ների համար
Fetch API ներկայացված է որպես ժամանակակից փոխարինում XMLHttpRequest-ին՝ նախատեսված ցանցային հարցումների ավելի պարզ, հարմար և ճկուն իրականացման համար։ Այն բազային Promise-հիմնված API է, որը թույլ է տալիս գրել ավելի կարճ, ընթեռնելի և մաքուր asyncronous JavaScript կոդ՝ օգտագործելով async/await սինթաքսը։
Մանրամասներ Fetch API-ի մասին.
- Ավտոմատ վերադարձնում է Promise, որը լուծվում է, երբ ստացվում է Response օբյեկտ
- Response օբյեկտն ապահովում է բազմաթիվ մեթոդներ՝ տվյալները վերլուծելու համար (json(), text(), blob(), arrayBuffer() և այլն)
- Աջակցում է լայն սպեկտր HTTP մեթոդների, հեդերների, բոդիների, և CORS քաղաքականությունների կարգավորմանը
- Լիովին աջակցում է async/await սինթաքսին, ինչը հեշտացնում է կոդի հոսքի կառավարումը
Դիտարկենք պարզ օրինակ՝ GET հարցում կատարելու և JSON պատասխան ստանալու համար՝
fetch("https://jsonplaceholder.typicode.com/posts/1")
.then(response => {
if (!response.ok) {
throw new Error("Network response was not ok " + response.statusText);
}
return response.json();
})
.then(data => { console.log("Response data:", data); })
.catch(error => { console.error("Fetch error:", error); });
Կամ async/await սինթաքսով՝
async function fetchPost() {
try {
const response = await fetch("https://jsonplaceholder.typicode.com/posts/1");
if (!response.ok) { throw new Error("Network response was not ok " + response.status); }
const data = await response.json(); console.log("Response data:", data);
} catch (error) {
console.error("Fetch error:", error);
}
}
fetchPost();
Fetch API-ի առավելություններն են՝
- Կոդի կրճատված և պարզ տեսք՝ Promise-ների և async/await-ի շնորհիվ
- Լավ ինտեգրում է ժամանակակից JavaScript գործիքների և async ֆունկցիաների հետ
- Հեշտ է զարգացնել և պահպանել մեծ ծրագրերում
- Լայն աջակցություն է ստանում ժամանակակից բրաուզերներում
Սահմանափակումներ և ուշադրության առարկաներ՝
Fetchչի ապահովում ավտոմատ request timeout, ինչը պետք է կառավարել ձեռքով- Չի ապահովում մի քանի հարմարավետ իրադարձություններ, ինչպիսիք են XHR-ի progress event-ները
- CORS քաղաքականությունները պետք է ճիշտ կարգավորվեն սերվերային կողմից, հակառակ դեպքում հնարավոր են բլոկավորում
Ընդհանուր առմամբ՝ Fetch API-ն առաջարկում է հարմար, ժամանակակից և «մաքուր» եղանակ HTTP հարցումներ իրականացնելու համար՝ դարձնելով JavaScript ցանցային կոդը ավելի ընթեռնելի և կայուն։
Հաջորդում կանդրադառնանք համեմատական վերլուծությանը՝ XMLHttpRequest-ի և Fetch API-ի միջև՝ հասկանալու առավելություններն ու թերությունները և երբ ո՞ր մեթոդն է նախընտրելի օգտագործել։