في هذا الدرس التطبيقي حول الترميز، سنتعرّف على آلية عمل المصدر المشترك عند جلب الموارد.
الإعداد: جلب الصفحة من المصدر نفسه
تتم استضافة الإصدار التجريبي على https://same-origin-policy-fetch.glitch.me.
تستخدم صفحة الويب البسيطة هذه fetch لتحميل المورد من https://same-origin-policy-fetch.glitch.me/fetch.html. بما أنّ index.html وfetch.html يتشاركان المصدر نفسه، من المفترض أن يظهر 200 في المعاينة المباشرة.
1. جلب الصفحة من مصدر مختلف
حاوِل تغيير عنوان URL الخاص بالجلب إلى https://www.google.com.
ماذا ترى في المعاينة المباشرة؟
من المفترض أن يكون المتصفّح قد حظر طلب الجلب لأنّك طلبت موردًا من مصدر مختلف. وهذا يعني أنّ المهاجم لا يمكنه قراءة الموارد المتعدّدة المصادر حتى إذا تمكّن من التحكّم في متصفّح المستخدم.
2. جلب مورد متعدّد المصادر
يُرجى محاولة تغيير عنوان URL الخاص بالجلب إلى https://api.thecatapi.com/v1/images/search.
ماذا ترى في المعاينة المباشرة؟
عنوان URL الخاص بالجلب هو مصدر مختلف، ولكن من المفترض أن يظهر لك رمز الحالة 200. لماذا؟ غالبًا ما تطلب تطبيقات الويب الحديثة موارد متعددة المصادر لتحميل النصوص البرمجية التابعة لجهات خارجية أو طلب نقطة نهاية لواجهة برمجة التطبيقات. لتلبية حالات الاستخدام هذه، هناك آلية تسمى CORS (مشاركة الموارد متعدّدة المصادر) لإخبار المتصفح بأن تحميل مورد متعدّد المصادر مسموح به. لمزيد من المعلومات حول CORS، يُرجى الاطّلاع على مقالة مشاركة الموارد المتعدّدة المصادر بأمان.