Żądania sieciowe: testowanie witryny przez blokowanie lub ograniczanie żądań sieciowych

Ewa Gasperowicz

Użyj panelu Warunki żądania, aby sprawdzić, jak zachowuje się strona, gdy niektóre zasoby, np. obrazy lub arkusze stylów, nie mogą się wczytać lub wczytują się wolniej.

Przegląd

W panelu Warunki żądania możesz blokować wiele zasobów lub „wzorców” jednocześnie i przełączać je na liście. Możesz też blokować domeny lub adresy URL żądań sieciowych w panelu Sieć. Odpowiednie wzorce pojawią się w panelu Warunki żądania.

Panel Warunki żądania umożliwia:

  • Dodawanie i usuwanie wzorów
  • Edytuj wzory.
  • Usuń wszystkie wzorce.
  • Włącz lub wyłącz blokowanie lub ograniczanie żądań sieciowych. Po włączeniu tej funkcji możesz włączać i wyłączać blokowanie lub ograniczanie poszczególnych wzorców.

Zamknięcie Narzędzi deweloperskich wyłącza blokowanie i ograniczanie żądań sieciowych. Musisz otworzyć panel i ponownie włączyć blokowanie. Narzędzia deweloperskie zapisują jednak wzorce nawet po zamknięciu przeglądarki.

Blokowanie lub ograniczanie żądania sieciowego

Żądania sieciowe możesz blokować w panelu Sieć w Narzędziach deweloperskich.

  1. W panelu Sieć w sekcji Nazwa kliknij prawym przyciskiem myszy żądanie i wybierz Zablokuj żądanie lub Ogranicz żądanie. obraz
  2. Automatycznie otworzy się panel Warunki żądania, w którym odpowiedni wzorzec będzie oznaczony jako zablokowany lub ograniczony. Spowoduje to również automatyczne zaznaczenie pola wyboru Włącz blokowanie i ograniczanie.

Sprawdzanie, które żądania są ograniczane lub blokowane

Aby odróżnić żądania, które są powolne, od tych, które są ograniczane przez Narzędzia deweloperskie, możesz sprawdzić panele Sieć i Wydajność.

W panelu Sieć:

  • Zablokowane żądania: sprawdź kolumnę Stan. Zablokowane żądania będą wyraźnie widoczne (blocked:devtools) i oznaczone kolorem czerwonym.
  • Ograniczone żądania: obok adresu URL żądania pojawi się ikona w kolorze złotym lub brązowym. Możesz też sprawdzić kolumnę Czas. Ikona pojawi się obok czasu.
    • Najedź kursorem na ikonę, aby sprawdzić, które warunki sieci zostały zastosowane.
    • Kliknij ikonę, aby natychmiast otworzyć panel Warunki żądania i wyróżnić regułę odpowiedzialną za ograniczanie przepustowości.

Panel Sieć w Narzędziach deweloperskich pokazujący wskaźniki zablokowanych i ograniczonych żądań.

W panelu Wydajność: Podczas nagrywania profilu wydajności możesz też sprawdzić warunki sieciowe. Aby to zrobić:

  1. Otwórz panel Wydajność i zarejestruj nagranie.
  2. Znajdź żądanie na ścieżce Sieć.
  3. Najedź kursorem na żądanie, aby wyświetlić etykietkę z informacjami o zastosowanych warunkach sieciowych.

Otwieranie panelu warunków żądania

Aby otworzyć panel Warunki żądania:

  1. Otwórz Narzędzia deweloperskie.
  2. Otwórz menu poleceń, naciskając:
    • macOS: Command+Shift+P
    • Windows, Linux, ChromeOS: Ctrl+Shift+P Menu poleceń z
  3. Zacznij wpisywać Request conditions, wybierz Pokaż warunki prośby i naciśnij Enter. U dołu okna Narzędzi deweloperskich pojawi się panel Warunki żądania.

Możesz też w prawym górnym rogu kliknąć Więcej narzędzi > Warunki żądania.

Modyfikowanie ustawienia ograniczania

Aby dostosować ustawienie ograniczania:

  1. Otwórz panel Warunki żądania i przejdź do konkretnego żądania.
  2. W kolumnie Ograniczanie wybierz gotowe ustawienie (np. Wolne 3G, Szybkie 3G) z menu. Możesz też dodać niestandardowy profil sieci.

Modyfikowanie wzorca żądania

Aby zmodyfikować wzorzec, w panelu Warunki żądania kliknij przycisk Edytuj obok wzorca, wprowadź zmiany i kliknij Zapisz. Możesz też kliknąć przycisk Dodaj warunek, aby utworzyć nowy warunek. Podczas wpisywania wzorca adresu URL możesz używać symboli wieloznacznych (*), aby dopasowywać dynamiczne części adresu URL. Na przykład *://example.com będzie pasować do wszystkich żądań API wysyłanych do tej domeny. Za pomocą interfejsu URL Pattern API możesz stosować warunki do wielu zasobów jednocześnie.

Przełączanie blokowania żądań sieciowych

Pole wyboru Włącz blokowanie i ograniczanie umożliwia włączanie i wyłączanie blokowania żądań sieciowych dla wszystkich wzorców jednocześnie.

Zmiana kolejności wzorców dopasowania adresów URL

Jeśli żądanie pasuje do kilku wzorców, Narzędzia deweloperskie zastosują pierwszą znalezioną regułę. Aby kontrolować ten priorytet, kliknij przyciski strzałek obok konkretnej reguły w panelu Warunki żądania, aby przenieść reguły o wysokim priorytecie na górę listy.

Usuwanie wzorca blokowania żądań sieciowych

Aby usunąć z listy konkretny wzorzec blokowania żądań sieciowych:

  • W panelu Warunki żądania kliknij przycisk Usuń.

Aby usunąć wszystkie wzorce blokowania żądań sieciowych, na pasku aktywności kliknij przycisk Usuń wszystkie wzorce blokowania sieci.