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

Kayce Basques

Sofia Emelianova

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

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

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

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

لإيقاف طلبات التسجيل:

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

محو الطلبات

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

محاكاة الوضع بلا إنترنت

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

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

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

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

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

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

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

بالإضافة إلى الإعدادات المُسبقة، مثل 4G البطيء أو السريع، يمكنك أيضًا إضافة ملفات تعريف مخصّصة للحدّ من السرعة:

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

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

   

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

تقييد اتصالات WebSocket

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

لمراقبة تقييد عدد طلبات WebSocket:

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

محاكاة اتصالات الشبكة البطيئة من درج "حالات الشبكة"

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

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 التي يزيد حجمها عن كيلوبايت واحد. تكون فلاتر السمات المتعدّدة هذه مكافئة لعمليات AND. لا تتوافق العمليات 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 محدّد تعبئ DevTools القائمة المنسدلة للإكمال التلقائي بجميع أنواع 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 باسم يتطابق مع القيمة المحدّدة تعبئ DevTools ميزة الإكمال التلقائي بجميع أسماء ملفات تعريف الارتباط التي صادفتها.
• set-cookie-value. عرض الموارد التي تتضمّن عنوان Set-Cookie بقيمة تطابق القيمة المحدّدة تعبئ "أدوات مطوّري البرامج" ميزة الإكمال التلقائي بجميع قيم ملفات تعريف الارتباط التي صادفتها.
• status-code: لعرض الموارد التي يتطابق رمز حالة HTTP الخاص بها مع الرمز المحدّد فقط. تعبئ DevTools قائمة الإكمال التلقائي المنسدلة بجميع رموز الحالة التي صادفتها.
• url: لعرض المراجع التي تتضمّن url مطابقًا للقيمة المحدّدة

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

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

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

لعرض موارد من أنواع متعددة في الوقت نفسه، اضغط مع الاستمرار على 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 للمرجع المطلوب.

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

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

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

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

• الرسم البياني الانحداري: تقسيم مرئي لنشاط كل طلب.

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

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

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

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

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

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

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

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

لتجميع الطلبات حسب الإطارات المضمّنة، افتح الإعدادات داخل لوحة الشبكة وضع علامة في المربّع 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. افتح علامة التبويب العناوين وانتقِل للأسفل إلى أقسام عام وعناوين الاستجابة وعناوين الطلب، وقسم عناوين Early Hints اختياريًا.

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

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

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

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

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

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

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

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

• مصدر الشبكة غير صالح. على سبيل المثال، نفِّذ fetch("https://jec.fish.com/unknown-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 إلى Time To First Byte. يشمل هذا التوقيت رحلة واحدة ذهابًا وإيابًا من وقت الاستجابة والوقت الذي استغرقه الخادم في إعداد الاستجابة.
• تنزيل المحتوى يتلقّى المتصفّح الردّ، إما مباشرةً من الشبكة أو من عامل الخدمة. هذه القيمة هي إجمالي الوقت المستغرَق في قراءة نص الاستجابة. قد تشير القيم الأكبر من المتوقّع إلى بطء الشبكة، أو إلى أنّ المتصفّح مشغول بتنفيذ مهام أخرى تؤخّر قراءة الرد.

عرض الجهات التي بدأت عمليات التتبُّع والتبعيات

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

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

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

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

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

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

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

عرض الحجم الإجمالي للموارد المنقولة والمحمَّلة

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  

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

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

  

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

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

ملاحظة: تقرأ لوحة الشبكة المشغّلات وتعرضها للطلبات التي تم استيرادها من ملفات HAR.

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

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

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

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

لنسخ جميع الطلبات، اتّبِع الخطوات التالية:

• نسخ جميع عناوين URL: لنسخ عناوين URL لجميع الطلبات إلى الحافظة
• نسخ الكل كأمر cURL: نسخ جميع الطلبات كسلسلة من أوامر cURL
• نسخ الكل بلغة PowerShell نسخ جميع الطلبات كسلسلة من أوامر PowerShell
• نسخ الكل كبنية متوافقة مع Fetch API نسخ جميع الطلبات كسلسلة من طلبات الاسترجاع
• نسخ الكل كبنية متوافقة مع 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 فلتر لإخفائه.

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

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

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

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

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