مرجع ميزات الشبكة

يمكنك التعرّف على طرق جديدة لتحليل كيفية تحميل صفحتك في هذا المرجع الشامل لميزات تحليل الشبكة في "أدوات مطوّري البرامج" في Chrome.

تسجيل طلبات الشبكة

تسجِّل "أدوات مطوري البرامج" تلقائيًا جميع طلبات الشبكة في لوحة الشبكة ما دامت "أدوات مطوّري البرامج" مفتوحة.

إيقاف تسجيل طلبات الشبكة

لإيقاف تسجيل الطلبات، اتّبِع الخطوات التالية:

• انقر على إيقاف تسجيل سجلّ الشبكة في لوحة الشبكة. ويتحول إلى اللون الرمادي للإشارة إلى أنّ "أدوات مطوّري البرامج" لم تعُد تسجِّل الطلبات.
• اضغط على Command> + E (نظام التشغيل Mac) أو Control + E (نظام التشغيل Windows وLinux) عندما تكون لوحة الشبكة في المقدّمة.

محو الطلبات

انقر على محو في لوحة الشبكة لمحو جميع الطلبات من جدول الطلبات.

حفظ الطلبات في جميع عمليات تحميل الصفحات

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

التقاط لقطات شاشة أثناء تحميل الصفحة

التقاط لقطات شاشة لتحليل ما يظهر للمستخدمين أثناء انتظار تحميل صفحتك

لتفعيل لقطات الشاشة، افتح الإعدادات داخل لوحة الشبكة وضع علامة في المربّع بجانب التقاط لقطات شاشة.

أعِد تحميل الصفحة عندما يكون التركيز على لوحة الشبكة هو أخذ لقطات شاشة.

بعد التقاط لقطة الشاشة، يمكنك التفاعل معها بالطرق التالية:

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

طلب إعادة تشغيل XHR

لإعادة تشغيل طلب XHR، نفِّذ أحد الإجراءات التالية في جدول الطلبات:

• اختَر الطلب واضغط على R.
• انقر بزر الماوس الأيمن على الطلب واختَر إعادة تشغيل XHR.

تغيير سلوك التحميل

محاكاة زائر لأول مرة عن طريق إيقاف ذاكرة التخزين المؤقت في المتصفح

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

إيقاف ذاكرة التخزين المؤقت للمتصفّح من مربّع "ظروف الشبكة"

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

1. انقر على الرمز لفتح درج حالات الشبكة.
2. ضع علامة في مربّع الاختيار إيقاف ذاكرة التخزين المؤقت أو أزِل العلامة من المربّع.

محو ذاكرة التخزين المؤقت للمتصفّح يدويًا

لمحو ذاكرة التخزين المؤقت للمتصفّح يدويًا في أي وقت، انقر بزر الماوس الأيمن في أيّ مكان في جدول الطلبات و اختَر محو ذاكرة التخزين المؤقت للمتصفّح.

محاكاة التشغيل بلا إنترنت

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

لمحاكاة تجربة شبكة بلا اتصال بالإنترنت تمامًا، اختَر بلا اتصال من القائمة المنسدلة تقييد الشبكة بجانب مربّع الاختيار إيقاف ذاكرة التخزين المؤقت.

تعرِض "أدوات مطوّري البرامج" رمز تحذير بجانب علامة التبويب الشبكة لتذكيرك بأنّ وضع "الاستغناء عن الإنترنت" مفعَّل.

محاكاة اتصالات الشبكة البطيئة

لمحاكاة شبكة الجيل الرابع السريعة أو شبكة الجيل الرابع البطيئة أو شبكة الجيل الثالث، اختَر الإعداد المسبق المناسب من القائمة المنسدلة تقييد البيانات في شريط الإجراءات أعلى الشاشة.

تعرض "أدوات مطوّري البرامج" رمز تحذير تحذير بجانب لوحة الشبكة لتذكيرك بأنّ ميزة "تقييد السرعة" مفعَّلة.

إنشاء ملفات تعريف مخصّصة للتقليل من عدد عمليات الربط

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

1. افتح القائمة تقييد البيانات واختَر مخصّص > إضافة....
2. إعداد ملف شخصي جديد للإبطاء كما هو موضّح في الإعدادات الإعدادات > الإبطاء

3. في لوحة الشبكة، اختَر ملفك الشخصي الجديد من القائمة المنسدلة تقييد السرعة.

   

تعرِض "أدوات المطوّر" رمز تحذير بجانب لوحة الشبكة لتذكيرك بأنّ ميزة "تقييد السرعة" مفعَّلة.

الحد من اتصالات WebSocket

بالإضافة إلى طلبات HTTP، تُبطئ أدوات المطوّرين عمليات الاتصال عبر WebSocket منذ الإصدار 99.

لمراقبة الحدّ من معدّل نقل البيانات في WebSocket:

1. يمكنك بدء عملية ربط جديدة، مثلاً، باستخدام أداة اختبار.
2. في لوحة الشبكة، اختَر عدم الحد من السرعة وأرسِل رسالة من خلال الاتصال.
3. أنشئ ملفًا شخصيًا مخصّصًا لإبطاء السرعة ببطء شديد، مثل 10 kbit/s. سيساعدك مثل هذا الملف الشخصي البطيء في ملاحظة الفرق.
4. في لوحة الشبكة، اختَر الملف الشخصي وأرسِل رسالة أخرى.
5. فعِّل فلتر WS، وانقر على اسم الاتصال، وافتح علامة التبويب الرسائل، وتحقّق من الفرق الزمني بين الرسائل المُرسَلة والمُعاد صديرها مع وضع حدود قصوى للسرعة وبدونه. على سبيل المثال:

محاكاة اتصالات الشبكة البطيئة من مربّع حالات الشبكة

إذا كنت تريد الحد من سرعة الاتصال بالشبكة أثناء العمل في لوحات DevTools الأخرى، استخدِم الدرج شروط الشبكة.

1. انقر على الرمز لفتح درج حالات الشبكة.
2. اختَر سرعة اتصال من قائمة التحكّم في الشبكة.

محو ملفات تعريف الارتباط في المتصفّح يدويًا

لمحو ملفات تعريف الارتباط في المتصفّح يدويًا في أي وقت، انقر بزر الماوس الأيمن في أيّ مكان في جدول الطلبات واختَر محو ملفات تعريف الارتباط في المتصفّح.

تجاهُل عناوين استجابة HTTP

راجِع تجاوز الملفات وعناوين استجابة HTTP على الجهاز.

إلغاء وكيل المستخدم

لتجاوز وكيل المستخدم يدويًا:

1. انقر على الرمز لفتح درج حالات الشبكة.
2. أزِل العلامة من المربّع بجانب اختيار تلقائي.
3. اختَر خيار وكيل مستخدم من القائمة، أو أدخِل خيارًا مخصّصًا في المربّع.

طلبات البحث

للبحث في عناوين الطلبات وحمولاتها واستجاباتها:

1. اضغط على الاختصار التالي لفتح علامة التبويب بحث على يسار الصفحة:

   • على نظام التشغيل macOS، اضغط على Command + F.
   • على نظام التشغيل Windows أو Linux، اضغط على Control + F.

2. في علامة التبويب بحث، أدخِل طلب البحث واضغط على Enter. يمكنك اختياريًا النقر على match_case أو regular_expression لتفعيل الحساسية لحالة الأحرف أو التعبيرات العادية على التوالي.

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

لإعادة تحميل نتائج البحث، انقر على إعادة تحميل إعادة التحميل. لمحو النتائج، انقر على حظر محو.

لمزيد من المعلومات حول جميع الطرق التي يمكنك من خلالها البحث في "أدوات المطوّرين"، اطّلِع على المقالة البحث: العثور على نص في جميع الموارد المحمَّلة.

فلترة الطلبات

فلترة الطلبات حسب المواقع

استخدِم المربّع فلترة لفلترة الطلبات حسب المواقع الإلكترونية، مثل النطاق أو حجم الطلب.

إذا لم يظهر لك المربّع، من المحتمل أن يكون شريط الفلاتر مخفيًا. راجِع إخفاء شريط الفلاتر.

لعكس الفلتر، ضع علامة في مربّع الاختيار عكس بجانب المربّع فلتر.

يمكنك استخدام خصائص متعددة في الوقت نفسه من خلال فصل كل خاصية بمسافة. على سبيل المثال، يعرض mime-type:image/gif larger-than:1K جميع ملفات GIF التي يزيد حجمها عن كيلوبايت واحد. إنّ فلاتر المواقع المتعدّدة هذه مكافئة لعمليات "و". عمليات OR غير معتمدة.

في ما يلي قائمة كاملة بالسمات المتوافقة.

• cookie-domain. عرض المراجع التي تضبط نطاق ملفّ تعريف ارتباط معيّنًا
• cookie-name. عرض الموارد التي تضبط اسم ملفّ تعريف ارتباط معيّنًا
• cookie-path. عرض الموارد التي تضبط مسار ملف تعريف ارتباط معيّنًا
• cookie-value. عرض الموارد التي تضبط قيمة ملف تعريف ارتباط معيّنة
• domain. عرض الموارد من النطاق المحدّد فقط يمكنك استخدام حرف بدل (*) لتضمين نطاقات متعددة. على سبيل المثال، تعرض *.com موارد من جميع أسماء النطاقات التي تنتهي بـ .com. تعرِض "أدوات المطوّر" قائمة منسدلة للإكمال التلقائي تمّت تعبئتها بجميع النطاقات التي عثر عليها.
• has-overrides. عرض الطلبات التي تم إلغاء content أو headers أو أي عمليات إلغاء (yes) أو عدم إجراء أي عمليات إلغاء (no). يمكنك إضافة عمود توفّر عمليات إلغاء المقابل إلى جدول الطلبات.
• has-response-header. عرض الموارد التي تحتوي على عنوان استجابة HTTP المحدّد تملأ "أدوات مطوّري البرامج" القائمة المنسدلة للإكمال التلقائي بجميع عناوين الاستجابة التي عثرت عليها.
• is. استخدِم is:running للعثور على WebSocket مورد.
• larger-than. عرض الموارد التي يزيد حجمها عن الحجم المحدّد بالبايت إنّ ضبط قيمة 1000 يعادل ضبط قيمة 1k.
• method. عرض الموارد التي تم استرجاعها من خلال نوع طريقة HTTP محدّد تملأ "أدوات مطوّري البرامج" القائمة المنسدلة للإكمال التلقائي بجميع طرق HTTP التي صادفها.
• mime-type. عرض موارد من نوع MIME محدّد تملأ "أدوات مطوّري البرامج" القائمة المنسدلة للإكمال التلقائي بجميع أنواع MIME التي صادفها.
• mixed-content. عرض جميع مصادر المحتوى المختلط (mixed-content:all) أو المصادر المعروضة فقط (mixed-content:displayed)
• priority. عرض الموارد التي يتطابق مستوى أولويتها مع القيمة المحدّدة
• resource-type. عرض موارد من نوع مورد، على سبيل المثال صورة. تملأ "أدوات مطوّري البرامج" القائمة المنسدلة للفراغ التلقائي بكل أنواع الموارد التي صادفها.
• response-header-set-cookie. عرض رؤوس Set-Cookie الأوّلية في علامة التبويب "المشاكل" سيتمّ الإبلاغ عن ملفات تعريف الارتباط التي تشكّل بشكلٍ غير صحيح مع عناوين Set-Cookie غير صحيحة في لوحة "الشبكة".
• scheme. عرض الموارد التي تم استرجاعها من خلال HTTP غير المحمي (scheme:http) أو HTTPS المحمي (scheme:https).
• set-cookie-domain. عرض الموارد التي تحتوي على عنوان Set-Cookie مع سمة Domain تتطابق مع القيمة المحدّدة تملأ أدوات المطوّرين ميزة الإكمال التلقائي بجميع نطاقات ملفّات ملفّات تعريف الارتباط التي صادفها.
• set-cookie-name. عرض الموارد التي تحتوي على عنوان Set-Cookie مع اسم يتطابق مع القيمة المحدّدة تملأ "أدوات مطوّري البرامج" ميزة الإكمال التلقائي بجميع أسماء ملفات تعريف الارتباط التي عثرت عليها.
• set-cookie-value. عرض الموارد التي تحتوي على عنوان Set-Cookie مع قيمة تطابق القيمة المحدّدة تملأ "أدوات مطوّري البرامج" ميزة الإكمال التلقائي بجميع قيم ملفات تعريف الارتباط التي عثرت عليها.
• status-code. عرض الموارد التي تتطابق رمز حالة HTTP الخاصة بها مع الرمز المحدّد فقط تملأ DevTools القائمة المنسدلة للإكمال التلقائي بجميع رموز الحالة التي واجهتها.
• url. عرض الموارد التي تحتوي على url تتطابق مع القيمة المحدّدة

فلترة الطلبات حسب النوع

لفلترة الطلبات حسب نوع المورد، انقر على الزرّ الكل أو Fetch/XHR أو JS أو CSS أو Img أو Media أو Font أو Doc أو WS (WebSocket) أو Wasm (WebAssembly) أو Manifest أو غير ذلك (أي نوع آخر غير مُدرَج هنا) في لوحة الشبكة.

وإذا لم تتمكّن من رؤية هذه الأزرار، من المحتمل أن يكون شريط إجراءات الفلاتر مخفيًا. راجِع إخفاء شريط الفلاتر.

لعرض موارد من أنواع متعدّدة في الوقت نفسه، اضغط مع الاستمرار على Command (في نظام التشغيل Mac) أو Control (في نظام التشغيل Windows أو Linux) ثم انقر على عدة فلاتر أنواع.

فلترة الطلبات حسب الوقت

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

إخفاء عناوين URL للبيانات

عناوين URL الخاصة بالبيانات هي ملفات صغيرة مضمّنة في مستندات أخرى. وأي طلب يظهر لك في جدول الطلبات ويبدأ بـ data: هو عنوان URL للبيانات.

لإخفاء هذه الطلبات، اختَر المزيد من الفلاتر > check_box إخفاء عناوين URL للبيانات من شريط إجراءات الفلاتر.

يعرض شريط الحالة في أسفل الصفحة عدد الطلبات المعروضة من إجمالي الطلبات.

إخفاء عناوين URL للإضافات

للتركيز على الرمز البرمجي الذي تكتبه، يمكنك فلترة الطلبات غير ذات الصلة التي ترسلها الإضافات التي ربما تكون قد ثبّتها في Chrome. تتضمّن طلبات الإضافات عناوين URL تبدأ بـ chrome-extension://.

لإخفاء طلبات الإضافات، في شريط الإجراءات الفلاتر، اختَر مزيد من الفلاتر > check_box إخفاء عناوين URL للإضافات.

يعرض شريط الحالة في أسفل الصفحة عدد الطلبات المعروضة من إجمالي الطلبات.

عرض الطلبات التي تتضمَّن ملفات تعريف الارتباط المحظورة الخاصة بالاستجابة فقط

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

يعرض شريط الحالة في أسفل الصفحة عدد الطلبات المعروضة من إجمالي الطلبات.

لمعرفة سبب حظر ملف تعريف ارتباط الاستجابة، اختَر الطلب وافتح علامة التبويب ملفات تعريف الارتباط ومرِّر مؤشر الماوس فوق رمز المعلومات المعلومات.

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

عرض الطلبات المحظورة فقط

لفلترة كل الطلبات باستثناء الطلبات المحظورة، في شريط الإجراءات الفلاتر، اختَر مزيد من الفلاتر > check_box الطلبات المحظورة. لاختبار ذلك، يمكنك استخدام علامة التبويب حظر طلبات الشبكة في اللوحة الجانبية.

يُبرز جدول الطلبات الطلبات المحظورة باللون الأحمر. يعرض شريط الحالة في أسفل الصفحة عدد الطلبات المعروضة من إجمالي الطلبات.

عرض طلبات الجهات الخارجية فقط

لفلترة كل الطلبات باستثناء الطلبات التي يختلف مصدرها عن مصدر الصفحة، اختَر المزيد من الفلاتر > check_box الطلبات التابعة لجهات خارجية في شريط الإجراءات الفلاتر. يمكنك تجربته في هذه الصفحة التجريبية.

يعرض شريط الحالة في أسفل الصفحة عدد الطلبات المعروضة من إجمالي الطلبات.

ترتيب الطلبات

يتم ترتيب الطلبات في جدول الطلبات تلقائيًا حسب وقت البدء، ولكن يمكنك ترتيب الجدول باستخدام معايير أخرى.

الترتيب حسب العمود

انقر على عنوان أي عمود في جدول الطلبات لترتيب الطلبات حسب ذلك العمود.

الترتيب حسب مرحلة النشاط

لتغيير طريقة ترتيب العرض الإعلاني بدون انقطاع للطلبات، انقر بزر الماوس الأيمن على عنوان جدول "الطلبات"، ومرِّر مؤشر الماوس فوق العرض الإعلاني بدون انقطاع، واختَر أحد الخيارَين التاليَين:

• وقت البدء: يظهر الطلب الأول الذي تم بدؤه في أعلى الصفحة.
• مدة الاستجابة: يظهر الطلب الأول الذي بدأ التنزيل في أعلى الصفحة.
• وقت الانتهاء: يظهر الطلب الأول الذي اكتمل في أعلى الصفحة.
• إجمالي المدّة: يظهر فيверху الطلب الذي يستغرق أقل وقت في إعداد الاتصال والطلب / الاستجابة.
• وقت الاستجابة: يظهر الطلب الذي انتظر أقل مدة للحصول على رد في أعلى الصفحة.

تفترض هذه الأوصاف أنّ كل خيار مُدرَج من الأقصر إلى الأطول. يؤدي النقر على عنوان عمود العرض المرئي إلى عكس الترتيب.

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

تحليل الطلبات

ما دامت "أدوات مطوّري البرامج" مفتوحة، يتم تسجيل جميع الطلبات في لوحة الشبكة. استخدِم لوحة الشبكة لتحليل الطلبات.

عرض سجلّ للطلبات

استخدِم جدول الطلبات لعرض سجلّ لجميع الطلبات التي تم إجراؤها عندما كانت "أدوات مطوّري البرامج" مفتوحة. يؤدي النقر على الطلبات أو تمرير مؤشر الماوس فوقها إلى إظهار مزيد من المعلومات عنها.

يعرض جدول "الطلبات" الأعمدة التالية تلقائيًا:

• الاسم. اسم ملف المورد أو معرّفه

• الحالة: يمكن أن يعرض هذا العمود القيم التالية:

  

  • رمز حالة HTTP، على سبيل المثال، 200 أو 404
  • تعذّر إرسال CORS error للطلبات بسبب مشاركة الموارد المتعدّدة المصادر (CORS).
  • (blocked:origin) للطلبات التي تحتوي على رؤوس تم ضبطها بشكلٍ غير صحيح مرِّر مؤشر الماوس فوق قيمة الحالة هذه للاطّلاع على تلميح يشير إلى الخطأ الذي حدث.
  • (failed) متبوعة برسالة الخطأ

• النوع: نوع MIME للمورد المطلوب

• المُشغِّل: يمكن للكائنات أو العمليات التالية بدء الطلبات:

  • المحلِّل محلّل HTML في Chrome.
  • إعادة التوجيه إعادة توجيه HTTP.
  • النص البرمجي: دالة JavaScript.
  • غير ذلك: أي عملية أو إجراء آخر، مثل الانتقال إلى صفحة باستخدام رابط أو إدخال عنوان URL في شريط العناوين

• الحجم: الحجم الإجمالي لعناوين الاستجابة بالإضافة إلى نص الاستجابة، كما يقدّمه الخادم

• الوقت. إجمالي المدة، من بداية الطلب إلى استلام البايت الأخير في الاستجابة.

• منهجية الشلال. تحليل مرئي لنشاط كل طلب.

إضافة أعمدة أو إزالتها

انقر بزر الماوس الأيمن على عنوان جدول الطلبات وحدِّد خيارًا لإخفائه أو عرضه. تظهر علامات اختيار بجانب الخيارات المعروضة.

يمكنك إضافة الأعمدة الإضافية التالية أو إزالتها: المسار وعنوان URL والطريقة والبروتوكول والمخطط والنطاق والعنوان البعيد ومساحة العنوان البعيد ومساحة عنوان بادئ التشغيل وملفات تعريف الارتباط وضبط ملفات تعريف الارتباط والأولوية ومعرّف الاتصال وعمليات الإلغاء والعرض الشلال.

إضافة أعمدة مخصّصة

لإضافة عمود مخصّص إلى جدول الطلبات:

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

تجميع الطلبات حسب الإطارات المضمّنة

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

لتجميع الطلبات حسب إطارات iframe، افتح الإعدادات داخل لوحة الشبكة وضَع علامة في check_box تجميع الطلبات حسب الإطار.

لعرض طلب بدأه إطار مضمّن، يجب توسيعه في سجلّ الطلبات.

عرض توقيت الطلبات بالنسبة إلى بعضها

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

راجع الترتيب حسب مرحلة النشاط لمعرفة الطرق المختلفة التي يمكنك من خلالها ترتيب منهجية الشلال.

تحليل رسائل اتصال WebSocket

لعرض رسائل اتصال WebSocket:

1. ضمن عمود الاسم في جدول الطلبات، انقر على عنوان URL لاتّصال WebSocket.
2. انقر على علامة التبويب الرسائل. يعرض الجدول آخر 100 رسالة.

لإعادة تحميل الجدول، يُرجى إعادة النقر على اسم اتصال WebSocket ضمن عمود الاسم في جدول الطلبات.

يحتوي الجدول على ثلاثة أعمدة:

• البيانات: حمولة الرسالة إذا كانت الرسالة نصًا عاديًا، يتم عرضها هنا. بالنسبة إلى تعليمات المعالجة الثنائية ، يعرض هذا العمود اسم تعليمات المعالجة ورمزها. تتوفّر أوامر التشغيل التالية: إطار المتابعة والإطار الثنائي وإطار إغلاق الاتصال وإطار Ping وإطار Pong.
• الطول: طول حمولة الرسالة، بالبايت
• الوقت. الوقت الذي تم فيه استلام الرسالة أو إرسالها

يتم ترميز الرسائل حسب اللون وفقًا لنوعها:

• تكون الرسائل النصية الصادرة خضراء فاتحة.
• تظهر الرسائل النصية الواردة باللون الأبيض.
• رموز التشغيل لواجهة WebSocket خفيفة اللون الأصفر.
• تظهر الأخطاء باللون الأحمر الفاتح.

تحليل الأحداث في بث

للاطّلاع على الأحداث التي تبثّها الخوادم من خلال Fetch API وEventSource API وXHR:

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

لفلترة الأحداث، حدِّد تعبيرًا عاديًا في شريط الفلتر في أعلى علامة التبويب EventStream.

لمحو قائمة الأحداث التي تم تسجيلها، انقر على الحظر محو.

عرض معاينة لنص الاستجابة

لعرض معاينة لنص استجابة:

1. انقر على عنوان URL للطلب، ضمن عمود الاسم في جدول الطلبات.
2. انقر على علامة التبويب معاينة.

تكون علامة التبويب هذه مفيدة في الغالب لعرض الصور.

عرض نص الاستجابة

للاطّلاع على نصّ الاستجابة لطلب معيّن:

1. انقر على عنوان URL للطلب، ضمن عمود الاسم في جدول "الطلبات".
2. انقر على علامة التبويب الردّ.

عرض عناوين HTTP

للاطّلاع على بيانات عنوان HTTP لأحد الطلبات:

1. انقر على طلب في جدول الطلبات.
2. افتح علامة التبويب الرؤوس وانتقِل للأسفل إلى أقسام الإعدادات العامة ورؤوس الاستجابة ورؤوس الطلبات ورؤوس الإشارات المبكّرة اختياريًا.

في قسم عام، تعرِض لك أدوات مطوّري البرامج رسالة حالة قابلة للقراءة بجانب رمز حالة HTTP المستلَم.

في قسم رؤوس الاستجابة، يمكنك تمرير مؤشر الماوس فوق قيمة عنوان والنقر على زر تعديل تعديل لإلغاء عنوان الاستجابة على مستوى الجهاز.

عرض مصدر عنوان HTTP

تعرض علامة التبويب العناوين تلقائيًا أسماء العناوين أبجديًا. لعرض أسماء عناوين HTTP بالترتيب الذي تم استلامها به:

1. افتح علامة التبويب العناوين للطلب الذي يهمّك. راجِع عرض عناوين HTTP.
2. انقر على عرض المصدر بجانب قسم عنوان الطلب أو عنوان الردّ.

تحذير بشأن العناوين المؤقتة

في بعض الأحيان، تعرض علامة التبويب الرؤوس رسالة التحذير Provisional headers are shown.... ومن الممكن أن يرجع ذلك للأسباب التالية:

• لم يتم إرسال الطلب من خلال الشبكة، بل تم عرضه من ذاكرة تخزين مؤقت محلية لا تخزِّن عناوين الطلب الأصلية. في هذه الحالة، يمكنك إيقاف ميزة التخزين المؤقت للاطّلاع على عناوين الطلب الكاملة.

• مرجع الشبكة غير صالح. على سبيل المثال، نفِّذ fetch("https://jec.fish.com/unknown-url/") في وحدة التحكّم.

يمكن أن تعرض "أدوات مطوّري البرامج" أيضًا العناوين المؤقتة فقط لأسباب تتعلق بالأمان.

عرض حمولة الطلب

للاطّلاع على الحمولة المطلوبة للطلب، أي مَعلمات سلسلة طلب البحث وبيانات النموذج، اختَر طلبًا من جدول الطلبات وافتح علامة التبويب الحِمولة.

عرض مصدر الحمولة

تعرض "أدوات مطوري البرامج" تلقائيًا الحمولة في نموذج يمكن للمستخدم قراءته.

للاطّلاع على مصادر مَعلمات سلسلة طلب البحث وبيانات النماذج، انقر على عرض المصدر بجانب قسمَي مَعلمات سلسلة طلب البحث أو بيانات النموذج في علامة التبويب الحمولة.

عرض الوسيطات التي تم فك ترميزها من عنوان URL لمَعلمات سلسلة الطلب

لتفعيل أو إيقاف ترميز عنوان URL للوسيطات، انقر على عرض المحتوى غير المشفَّر أو عرض المحتوى المشفَّر بعنوان URL في علامة التبويب الحمولة.

عرض ملفات تعريف الارتباط

للاطّلاع على ملفات تعريف الارتباط المُرسَلة في عنوان HTTP للطلب:

1. انقر على عنوان URL للطلب، ضمن عمود الاسم في جدول "الطلبات".
2. انقر على علامة التبويب ملفّات تعريف الارتباط (Cookies).

للاطّلاع على وصف لكل عمود، اطّلِع على الحقول.

لتعديل ملفات تعريف الارتباط، اطّلِع على مقالة عرض ملفات تعريف الارتباط وتعديلها وحذفها.

عرض تفاصيل التوقيت لطلب معيّن

للاطّلاع على تفاصيل التوقيت لطلب معيّن:

1. انقر على عنوان URL للطلب، ضمن عمود الاسم في جدول الطلبات.
2. انقر على علامة التبويب التوقيت.

اطّلِع على معاينة تفاصيل التوقيت للوصول إلى هذه البيانات بشكل أسرع.

اطّلِع على شرح مراحل تقسيم التوقيت للحصول على مزيد من المعلومات عن كل مرحلة من المراحل التي قد تظهر لك في علامة التبويب التوقيت.

معاينة تفاصيل التوقيت

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

اطّلِع على عرض تفاصيل التوقيت لطلب معيّن لمعرفة طريقة للوصول إلى هذه البيانات لا تتطلّب تمرير مؤشر الماوس.

شرح مراحل تقسيم الوقت

في ما يلي مزيد من المعلومات عن كل مرحلة قد تظهر لك في علامة التبويب التوقيت:

• الانتظار في "قائمة المحتوى التالي" يضع المتصفّح الطلبات في "قائمة الانتظار" قبل بدء عملية الاتصال وفي الحالات التالية:
  • هناك طلبات ذات أولوية أعلى.
  • هناك ستة اتصالات بروتوكول TCP مفتوحة لهذا المصدر، وهو الحد الأقصى. ينطبق على HTTP/1.0 وHTTP/1.1 فقط.
  • يخصّص المتصفّح مساحة لفترة وجيزة في ذاكرة التخزين المؤقت على القرص.
• توقّف. يمكن أن يتم إيقاف الطلب بعد بدء الاتصال لأي من الأسباب الموضّحة في قائمة الانتظار.
• بحث نظام أسماء النطاقات يحدِّد المتصفّح عنوان IP للطلب.
• الاتصال الأولي: ينشئ المتصفّح اتصالاً، بما في ذلك عمليات تأكيد الاتصال أو عمليات إعادة المحاولة في بروتوكول النقل المتعدّد (TCP) وعمليات التفاوض على بروتوكول أمان طبقة النقل (SSL).
• مدة التفاوض مع الخادم الوكيل: يتفاوض المتصفّح مع خادم وكيل بشأن الطلب.
• تم إرسال الطلب. يتم إرسال الطلب.
• إعداد مشغِّلي الخدمات: يشغِّل المتصفّح الخدمة العاملة.
• طلب إلى ServiceWorker يتم إرسال الطلب إلى عامل الخدمة.
• قيد الانتظار (وقت وصول أول بايت): ينتظر المتصفّح أول بايت من الاستجابة. اختصار TTFB يعني "مدة تحميل أول بايت". يشمل هذا التوقيت رحلة ذهاب وعودة واحدة من وقت الاستجابة والوقت الذي استغرقه الخادم لإعداد الاستجابة.
• تنزيل المحتوى: يتلقى المتصفح الاستجابة، إما مباشرةً من الشبكة أو من مشغّل الخدمات. هذه القيمة هي إجمالي الوقت المستغرَق في قراءة نص الردّ. قد تشير القيم الأكبر من المتوقع إلى بطء الشبكة أو أنّ المتصفّح مشغول بتنفيذ مهام أخرى ما يؤخّر قراءة الاستجابة.

عرض المشغّلات والتبعيات

للاطّلاع على عبارات البدء والتبعيات لأحد الطلبات، اضغط مع الاستمرار على Shift ومرِّر مؤشر الماوس فوق الطلب في جدول "الطلبات". تُلوّن "أدوات مطوّري البرامج" المشغّلات باللون الأخضر، وتُلوّن التبعيات باللون الأحمر.

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

عرض أحداث التحميل

تعرِض "أدوات المطوّر" توقيت حدثَي DOMContentLoaded وload في مواضع متعدّدة على لوحة الشبكة. لون حدث DOMContentLoaded باللون الأزرق، بينما حدث load باللون الأحمر.

عرض إجمالي عدد الطلبات

يتم إدراج إجمالي عدد الطلبات في شريط الحالة في أسفل لوحة الشبكة.

عرض إجمالي حجم الموارد التي تم نقلها وتحميلها

تعرض "أدوات المطوّر" إجمالي حجم الموارد المنقولة والمحمَّلة (غير المضغوطة) في شريط الحالة في أسفل لوحة الشبكة.

اطّلِع على عرض الحجم غير المضغوط لمورد لمعرفة حجم الموارد بعد إزالة ضغطها في المتصفّح.

عرض تقرير تتبُّع تسلسل استدعاء الدوال البرمجية الذي تسبّب في الطلب

عندما تؤدّي عبارة JavaScript إلى طلب مورد، مرِّر مؤشر الماوس فوق عمود المُنشئ لعرض تتبُّع تسلسل استدعاء الدوال البرمجية الذي يؤدّي إلى الطلب.

عرض الحجم غير المضغوط لمورد

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

في هذا المثال، كان حجم ملف www.google.com المضغوط الذي تم إرساله عبر الشبكة هو 43.8 KB، في حين كان حجمه غير المضغوط هو 136 KB.

تصدير بيانات الطلبات

يمكنك تصدير قائمة الطلبات أو نسخها، مع تطبيق الفلاتر، بعدّة طرق موضّحة أدناه.

حفظ جميع طلبات الشبكة في ملف HAR

HAR (أرشيف HTTP) هو تنسيق ملف تستخدمه العديد من أدوات جلسة HTTP لتصدير البيانات التي تم التقاطها. التنسيق هو كائن JSON يضم مجموعة معيّنة من الحقول.

لتقليل فرص تسرُّب المعلومات الحسّاسة عن طريق الخطأ، يمكنك تلقائيًا تصدير سجلّ الشبكة "المُصحَّح" بتنسيق HAR الذي يستبعد المعلومات الحسّاسة، مثل عناوين Cookie وSet-Cookie وAuthorization. يمكنك أيضًا تصدير السجلّ مع البيانات الحسّاسة إذا لزم الأمر.

لحفظ جميع طلبات الشبكة في ملف HAR، اختَر إحدى الطريقتَين التاليتَين:

• انقر بزر الماوس الأيمن على أي طلب في جدول الطلبات واختَر نسخ > حفظ الكل [المدرَج] كملف HAR (مُعفى من البيانات الحسّاسة) أو حفظ الكل [المدرَج] كملف HAR (مع البيانات الحسّاسة).

  

• انقر على تنزيل تصدير HAR (مُعدّ للاستخدام)... في شريط الإجراءات في أعلى لوحة الشبكة.

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

  

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

• اسحب ملف HAR وأفلِته في جدول الطلبات.
• انقر على تحميل استيراد سجلّ "تحليل الزيارات من موقعك الإلكتروني" في شريط الإجراءات في أعلى لوحة الشبكة.

نسخ طلب أو مجموعة من الطلبات التي تمّت فلترتها أو جميعها إلى الحافظة

ضمن عمود الاسم في جدول الطلبات، انقر بزر الماوس الأيمن على طلب، ومرِّر مؤشر الماوس فوق نسخ، ثم اختَر أحد الخيارَين التاليَين.

لنسخ طلب واحد أو ردّه أو تتبُّع تسلسل استدعاء الدوال البرمجية، اتّبِع الخطوات التالية:

• نسخ عنوان URL انسخ عنوان URL للطلب إلى الحافظة.
• نسخ النص كأمر cURL انسخ الطلب كأمر cURL.
• النسخ بلغة PowerShell انسخ الطلب كأمر PowerShell.
• نسخ النص كإجراء استرجاع انسخ الطلب كطلب استرجاع.
• النسخ كاسترجاع (Node.js). انسخ الطلب كطلب جلب Node.js.
• نسخ الرد انسخ نص الردّ إلى الحافظة.
• نسخ تتبُّع تسلسل استدعاء الدوال البرمجية انسخ تتبُّع تسلسل استدعاء الدوال البرمجية للطلب إلى الحافظة.

لنسخ جميع الطلبات:

• نسخ جميع عناوين URL: نسخ عناوين URL لجميع الطلبات إلى الحافظة
• نسخ الكل كنص cURL نسخ جميع الطلبات كسلسلة من أوامر cURL
• نسخ الكل بتنسيق PowerShell انسخ جميع الطلبات كسلسلة من أوامر PowerShell.
• نسخ الكل كبنية متوافقة مع Fetch API نسخ جميع الطلبات كسلسلة من طلبات الجلب
• نسخ الكل كإجراء استرجاع (Node.js) نسخ جميع الطلبات كسلسلة من طلبات استرجاع Node.js
• نسخ الكل بتنسيق HAR (مصحَّح) نسخ جميع الطلبات كبيانات HAR بدون بيانات حسّاسة، مثل عناوين Cookie وSet-Cookie وAuthorization
• نسخ الكل بتنسيق HAR (مع البيانات الحسّاسة) نسخ جميع الطلبات كبيانات HAR مع البيانات الحسّاسة

لنسخ مجموعة من الطلبات التي تمّت فلترتها، طبِّق فلترًا على سجلّ الشبكة، وانقر بزر الماوس الأيمن على طلب، ثم اختَر:

• انسخ جميع عناوين URL المدرجة. انسخ عناوين URL لجميع الطلبات التي تمت فلترتها إلى الحافظة.
• نسخ كل العناصر المُدرَجة بتنسيق cURL نسخ جميع الطلبات التي تمّت فلترتها كسلسلة من أوامر cURL
• انسخ كل الملفات المُدرَجة على أنّها PowerShell. انسخ جميع الطلبات التي تمّت فلترتها كسلسلة من أوامر PowerShell.
• نسخ كل البيانات المُدرَجة بتنسيق متوافق مع Fetch API نسخ جميع الطلبات التي تمّت فلترتها كسلسلة من طلبات استرجاع
• نسخ كل العناصر المُدرَجة بتنسيق متوافق مع Fetch API (Node.js) نسخ جميع الطلبات التي تمّت فلترتها كسلسلة من طلبات استرجاع Node.js
• نسخ كل البيانات بتنسيق HAR (مصحَّحة) نسخ جميع الطلبات التي تمت فلترتها كبيانات HAR بدون بيانات حسّاسة، مثل عناوين Cookie وSet-Cookie وAuthorization
• انسخ جميع العناوين المُدرَجة على أنّها HAR (مع البيانات الحسّاسة). يمكنك نسخ جميع الطلبات التي تمت فلترتها كبيانات HAR باستخدام بيانات حسّاسة.

تغيير تنسيق لوحة "الشبكة"

وسِّع أقسام واجهة مستخدم لوحة الشبكة أو اصغرها للتركيز على ما يهمّك.

إخفاء شريط إجراءات "الفلاتر"

تعرض "أدوات مطوّري البرامج" تلقائيًا شريط الفلاتر في أعلى لوحة الشبكة. انقر على filter_alt فلتر لإخفائه.

استخدام صفوف طلبات كبيرة

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

افتح الإعدادات وانقر على صفوف الطلبات الكبيرة للاطّلاع على الصفوف الكبيرة.

إخفاء مسار "نظرة عامة"

يعرض DevTools بشكل تلقائي مسار نظرة عامة. افتح الإعدادات وأزِل العلامة من مربّع الاختيار إظهار نظرة عامة لإخفائه.