Web Fetch API
Fetch API تسمح لمتصفحات الويب في أنشاء HTTP requests الي خوادم الويب دون الحاجة الي استخدام XMLHttpRequest
التاريخ
14 نوفمبر 2021
الدروس
146
المستوى
العامة
اللغة
انجليزي
المشاهدات
1511
المواضيع
24
الشروحات chevron_left Web Fetch API chevron_left JavaScript
Web Fetch API
</> Web Fetch API
يسمح لنا ال "Fetch API" ب انشاء HTTP requests مباشرة مع الخادم دون الحاجة الي استخدام " XMLHttpRequest "
</> Sending a Request
تستطيع انشاء طلب الي خادم الويب HTTP request عن طريق استخدام الدالة ( )fetch
تأخذ هذه الدالة Parameter واحد وهو يحتوي علي عنوان URL للعنصر الذي تريد الحصول عليه من الخادم
Syntax
let response = fetch(url);
Example
fetch(url) .then(response => { /* handle the response */ }) .catch(error => { /* handle the error */ });
</> Reading the Response
إذا كانت محتويات الرد Response هي عبارة عن نص ، يمكنك استخدام دالة text ()
تقوم الدالة text () بأرجاع Promise يتناسب مع المحتويات الخاصة بالعنصر الذي تم الحصول عليه من الخادم
Example
fetch('/readme.txt') .then(response => response.text()) .then(data => console.log(data));
</> Fetch API examples
Example
المثال التالي يقوم بعرض المحتوي الموجود بداخل ملف
fetch(file) .then(x => x.text()) .then(y => myDisplay(y));
هذا هو المثال السابق ولكن باستخدام ال async / await
async function getText(file) { let x = await fetch(file); let y = await x.text(); myDisplay(y); }