تجاوز محتوى الويب وعناوين استجابة HTTP محليًا

Sofia Emelianova

باستخدام عمليات الاستبدال المحلية، يمكنك إزالة الحظر عن سير العمل من خلال إنشاء نماذج أولية للتغييرات والإصلاحات واختبارها بدون انتظار أن تصبح متوافقة مع الخلفية أو الجهات الخارجية أو واجهات برمجة التطبيقات.

استخدِم عمليات الاستبدال المحلية لمحاكاة الموارد البعيدة حتى إذا لم يكن بإمكانك الوصول إليها. يمكنك محاكاة الاستجابات للطلبات والملفات المختلفة، مثل رؤوس استجابة HTTP ومحتوى الويب، بما في ذلك طلبات XHR وطلبات الجلب.

على سبيل المثال، يمكن أن تساعد عمليات إلغاء الإعدادات المحلية في حالات الاستخدام التالية:

• اختبار واجهة برمجة التطبيقات وإصلاحها قبل طرحها
• أنشئ نماذج أولية لتصاميم واجهة المستخدم الجديدة إذا كنت تعرف بنية البيانات التي ستستخدمها الواجهة الخلفية.
• اختبِر إصلاحات الأداء، مثل القضاء على CLS، للتأكّد مسبقًا من أنّها ذات تأثير كبير.

تتيح لك عمليات الاستبدال المحلية أيضًا الاحتفاظ بالتغييرات التي تجريها في "أدوات مطوّري البرامج في Chrome" عند تحميل الصفحات.

آلية العمل

• عند إجراء تغييرات في "أدوات مطوّري البرامج في Chrome"، تحفظ هذه الأدوات نسخة من الملف المعدَّل في مجلد تحدّده.
• عند إعادة تحميل الصفحة، تعرِض "أدوات مطوري البرامج" الملف المعدَّل على الجهاز بدلاً من مرجع الشبكة.

يمكنك أيضًا حفظ التغييرات مباشرةً في الملفات المصدر. اطّلِع على تعديل الملفات وحفظها باستخدام Workspaces.

القيود

تعمل عمليات الاستبدال المحلية مع رؤوس استجابة الشبكة ومعظم أنواع الملفات، بما في ذلك طلبات XHR وطلبات الجلب، مع بعض الاستثناءات:

• يتم إيقاف ذاكرة التخزين المؤقت عند تفعيل إجراءات التجاوز المحلية.
• لا تحفظ "أدوات المطوّر" التغييرات التي يتم إجراؤها في شجرة DOM في لوحة العناصر.
• إذا عدّلت ملف CSS في لوحة الأنماط وكان مصدر ملف CSS هذا هو ملف HTML، لن تحفظ أدوات المطوّر هذا التغيير.

بدلاً من ذلك، يمكنك تعديل ملفات HTML في لوحة المصادر.

إعداد إجراءات التجاوز المحلية

يمكنك إلغاء محتوى الويب أو عناوين الاستجابة على الفور في لوحة الشبكة:

1. افتح أدوات مطوّري البرامج، وانتقِل إلى لوحة الشبكة، وانقر بزر الماوس الأيمن على طلب تريد إلغاءه، ثم اختَر إلغاء العناوين أو إلغاء المحتوى من القائمة المنسدلة.
2. إذا لم يسبق لك إعداد عمليات إلغاء الإعدادات المحلية، سيطلب منك DevTools في شريط الإجراءات في أعلى الصفحة إجراء ما يلي:
   1. اختَر مجلدًا لتخزين الملفات التي تم تجاهلها فيه.
   2. انقر على السماح لمنح أدوات مطوّري البرامج أذونات الوصول إليه.
3. إذا سبق لك إعداد عناصر إلغاء محلية ولكنّها غير مفعّلة، تفعّلها "أدوات مطوّري البرامج" تلقائيًا.

4. بعد إعداد عمليات النسخ الاحتياطي المحلية وتفعيلها، ستنقلك "أدوات مطوّري البرامج" إلى:

   • لوحة المصادر التي تتيح لك إجراء تغييرات على محتوى الويب
   • المحرِّر في الشبكة > الرؤوس > رؤوس الاستجابة للسماح لك بإجراء تغييرات على رؤوس الاستجابة

لإيقاف إجراءات التجاوز المحلية مؤقتًا أو حذف جميع ملفات التجاوز، انتقِل إلى المصادر > إجراءات التجاوز وأزِل العلامة من مربّع الاختيار check_box_outline_blank تفعيل إجراءات التجاوز المحلية أو انقر على block محو على التوالي.

لحذف ملف إلغاء واحد أو جميع عمليات الإلغاء في مجلد، انقر بزر الماوس الأيمن على الملف أو المجلد في المصادر > عمليات الإلغاء، واختَر حذف، ثم انقر على حسنًا في مربّع الحوار. لا يمكن التراجع عن هذا الإجراء، وعليك إعادة إنشاء عمليات الاستبدال المحذوفة يدويًا.

للاطّلاع بسرعة على جميع عمليات الاستبدال، انقر بزر الماوس الأيمن على طلب في لوحة الشبكة واختَر عرض جميع عمليات الاستبدال. ستنقلك أدوات المطوّرين إلى المصادر > عمليات الاستبدال.

إلغاء محتوى الويب

لتجاهُل محتوى الويب:

1. إعداد عمليات النسخ الاحتياطي المحلية
2. إجراء تغييرات على الملفات وحفظها في أدوات المطوّرين

على سبيل المثال، يمكنك تعديل الملفات في المصادر أو CSS في العناصر > الأنماط، ما لم تكن صفحات CSS موجودة في ملفات HTML.

تحفظ أدوات المطوّرين الملفات المعدَّلة، وتُدرِجها في المصادر > عمليات الاستبدال، وتُظهر لك رمز بجانب الملفات التي تم استبدالها في اللوحات والأقسام ذات الصلة: العناصر > الأنماط والشبكة والمصادر > عمليات الاستبدال.

بالإضافة إلى ذلك، تعرض لوحة الشبكة رمز نقطة أرجوانية مع نصائح بجانب علامة التبويب الاستجابة لطلب تم استبدال محتوى الويب فيه.

تجاهُل طلبات XHR أو عمليات الجلب لمحاكاة الموارد البعيدة

باستخدام عمليات الاستبدال المحلية، لن تحتاج إلى الوصول إلى الخلفية ولن تضطر إلى الانتظار حتى تصبح التغييرات متاحة. إنشاء النماذج التجريبية والتجربة على الفور:

1. إعداد عمليات النسخ الاحتياطي المحلية
2. في الشبكة، فلترة طلبات XHR/fetch، ابحث عن الطلب الذي تريده، وانقر عليه بزر الماوس الأيمن، واختَر تجاوز المحتوى.
3. أدخِل التغييرات على البيانات التي تم جلبها واحفظ الملف.
4. refresh أعِد تحميل الصفحة واطّلِع على التغييرات التي تم تطبيقها.

للتعرّف على سير العمل هذا، يمكنك مشاهدة الفيديو التالي:

تتبُّع التغييرات المحلية

يمكنك تتبُّع جميع التغييرات التي تجريها على محتوى الويب في مكان واحد، وهو علامة التبويب التغييرات في الدرج.

بالإضافة إلى ذلك، في المصادر > عمليات الاستبدال، يمكنك النقر بزر الماوس الأيمن على الملف المحفوظ واختيار الفتح في المجلد الذي يحتوي عليه من قائمة السياقات. سيؤدي ذلك إلى فتح المجلد الذي اخترته أثناء إعداد عمليات الاستبدال. يمكنك من هناك تعديل الملفات باستخدام محرِّر الرموز البرمجية المفضّل لديك.

إلغاء عناوين استجابة HTTP

من لوحة الشبكة، يمكنك إلغاء عناوين استجابة HTTP بدون الوصول إلى خادم الويب.

باستخدام عمليات إلغاء عنوان الاستجابة، يمكنك إنشاء نماذج أولية محليًا للإصلاحات المتعلّقة بعناوين مختلفة، بما في ذلك على سبيل المثال لا الحصر:

• عناوين مشاركة الموارد المتعددة المصادر (CORS)
• عناوين سياسة الأذونات
• رؤوس العزل المشترَك المنشأ

لتجاوز عنوان استجابة:

1. إعداد عمليات إلغاء الإعدادات المحلية وفحص هذه الصفحة التجريبية، على سبيل المثال
2. انتقِل إلى الشبكة، وابحث عن طلب، وانقر عليه بزر الماوس الأيمن، ثم اختَر تجاوز العناوين. تنقلك أدوات المطوّرين إلى محرِّر العناوين > عناوين الاستجابة.

3. مرِّر مؤشر الماوس فوق قيمة عنوان استجابة وحرِّك المؤشر إليها.

   

   بدلاً من ذلك، لتفعيل محرِّر عناوين الاستجابة، مرِّر مؤشر الماوس فوق قيمة عنوان استجابة وانقر على تعديل تعديل.

4. عدِّل عنوانًا جديدًا أو أضِفه.

   

   • لتعديل قيمة عنوان، انقر عليها.
   • لإضافة عنوان جديد، انقر على add إضافة عنوان.
   • لإزالة إلغاء عنوان، انقر على delete بجانبه. يؤدي ذلك إلى إزالة العناوين التي أضفتها أو إعادة القيم المعدَّلة إلى القيم الأصلية.

   تُبرز لوحة الشبكة الرؤوس المعدَّلة باللون الأخضر والعناصر التي تم إلغاؤها باللون الأحمر والخط المُشطوب. بالإضافة إلى ذلك، تعرض علامة التبويب الرؤوس رمز نقطة أرجوانية مع تلميح يُعلمك بأنّه تم إلغاء الرؤوس.

5. refresh يُرجى إعادة تحميل الصفحة لتطبيق التغييرات.

تعديل جميع عمليات تجاوز عناوين الاستجابة

لتعديل جميع عمليات إلغاء الرؤوس في مكان واحد:

1. انقر على .headers بجانب قسم رؤوس الردود.

   

   تنقلك "أدوات المطوّر" إلى ملف .headers المقابل في المصادر > عمليات الاستبدال.

2. عدِّل ملف .headers:

   

   • لإضافة قاعدة إلغاء جديدة، انقر على إضافة قاعدة إلغاء. القاعدة هنا هي مجموعة من العناوين والقيم وطلب واحد أو عدّة طلبات لتطبيقها.

   • لإضافة زوج عنوان وقيمة إلى قاعدة، مرِّر مؤشر الماوس فوق زوج آخر وانقر على add.

   • لإلغاء قيمة عنوان، أزِل عنوانًا أو قاعدة تمّت إضافتهما، ومرِّر مؤشّر الماوس فوقهما وانقر على delete.

3. احفظ ملف .headers باستخدام Command / Control + S.

4. refresh يُرجى إعادة تحميل الصفحة لتطبيق التغييرات.