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

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

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

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

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

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

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

محو الطلبات

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

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

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

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

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

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

أعِد تحميل الصفحة عندما تكون لوحة الشبكة في المقدّمة لالتقاط لقطات الشاشة.

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

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

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

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

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

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

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

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

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

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

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

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

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

المحاكاة بلا إنترنت

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

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

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

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

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

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

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

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

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 التي يزيد حجمها عن كيلوبايت واحد. إنّ فلاتر المواقع المتعدّدة هذه مكافئة لعمليات "و". عمليات "أو" غير متاحة.

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

• 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 ملفات تعريف الارتباط المحظورة الخاصة بالاستجابة. يمكنك تجربته في هذه الصفحة التجريبية.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  

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

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

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

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

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

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

• منهجية الشلال: تقسيم مرئي لنشاط كل طلب

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

• تكون الرسائل النصية الصادرة خضراء فاتحة.
• تظهر الرسائل النصية الواردة باللون الأبيض.
• رموز التشغيل لواجهة 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. انقر على علامة التبويب التوقيت.

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

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

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

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

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

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

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

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