Sekcja Usługi w tle w Narzędziach deweloperskich Chrome to zbiór narzędzi dla interfejsów API JavaScriptu, które umożliwiają witrynie wysyłanie i odbieranie aktualizacji nawet wtedy, gdy użytkownik nie ma jej otwartej. Usługa działająca w tle jest pod względem funkcjonalności podobna do procesu działającego w tle.
W sekcji Usługi w tle możesz debugować te usługi w tle:
Narzędzia deweloperskie w Chrome mogą rejestrować zdarzenia pobierania, synchronizacji i powiadomień przez 3 dni, nawet gdy nie są otwarte. Dzięki temu możesz się upewnić, że zdarzenia są wysyłane i odbierane zgodnie z oczekiwaniami.
Oprócz zdarzeń usługi w tle narzędzia DevTools mogą też:
- wyświetlać raporty, które Chrome już wysłał lub zamierza wysłać za pomocą interfejsu Reporting API;
- Umożliwia debugowanie i testowanie pamięci podręcznej stanu strony internetowej za pomocą jednego kliknięcia.
Pobieranie w tle
Interfejs Background Fetch API umożliwia workerowi usługi niezawodne pobieranie dużych zasobów, takich jak filmy czy podcasty, jako usługi działającej w tle. Aby rejestrować zdarzenia pobierania w tle przez 3 dni, nawet gdy Narzędzia deweloperskie są zamknięte:
- Otwórz Narzędzia deweloperskie, na przykład na stronie demonstracyjnej.
Kliknij Aplikacja > Usługi w tle > Pobieranie w tle i
Nagrywaj.
Na stronie demonstracyjnej kliknij Zapisz zasoby lokalnie. Spowoduje to aktywność w tle związaną z pobieraniem. Narzędzia deweloperskie rejestrują zdarzenia w tabeli.
Kliknij zdarzenie, aby wyświetlić jego szczegóły w miejscu poniżej tabeli.
Możesz zamknąć Narzędzia deweloperskie i zostawić nagranie do 3 dni. Aby zatrzymać nagrywanie, kliknij
Zatrzymaj.
Synchronizacja w tle
Interfejs Background Sync API umożliwia serwisowi workerowi wysyłanie danych na serwer po ponownym nawiązaniu stabilnego połączenia z internetem. Aby rejestrować zdarzenia synchronizacji w tle przez 3 dni, nawet gdy Narzędzia deweloperskie są zamknięte:
- Otwórz Narzędzia deweloperskie, na przykład na stronie demonstracyjnej.
Kliknij Aplikacja > Usługi w tle > Synchronizacja w tle i
Nagrywaj.
Na stronie demonstracyjnej kliknij Zarejestruj synchronizację w tle, aby zarejestrować odpowiedni service worker, a potem, gdy pojawi się taka prośba, kliknij Zezwól.
Rejestracja skryptu service worker to działanie synchronizacji w tle. Narzędzia deweloperskie rejestrują zdarzenia w tabeli.
Kliknij zdarzenie, aby wyświetlić jego szczegóły w miejscu poniżej tabeli.
Możesz zamknąć Narzędzia deweloperskie i zostawić nagranie do 3 dni. Aby zatrzymać nagrywanie, kliknij
Zatrzymaj.
(Eksperymentalnie) Łagodzenie śledzenia przekierowań
Eksperyment Ograniczenie śledzenia powrotów w Chrome umożliwia identyfikowanie i usuwanie stanu witryn, które prawdopodobnie wykonują śledzenie w witrynach za pomocą techniki śledzenia powrotów. Możesz ręcznie wymusić środki zapobiegawcze dotyczące śledzenia i wyświetlić listę witryn, których stany zostały usunięte.
Aby wymusić łagodzenie śledzenia:
- Blokuj pliki cookie innych firm w Chrome. Otwórz
> Ustawienia > 
Prywatność i bezpieczeństwo > Pliki cookie i inne dane witryn > 
Blokuj pliki cookie innych firm. - W
chrome://flagsustaw eksperyment Łagodzenie śledzenia przekierowań na Włączony z usunięciem. - Otwórz DevTools, na przykład na stronie demonstracyjnej, i kliknij Aplikacja > Usługi w tle > Zminimalizowanie śledzenia powrotów.
- Na stronie demonstracyjnej kliknij link do strony odrzucającej i zaczekaj (10 sekund), aż Chrome zarejestruje odrzucenie. Karta Problemy ostrzega o nadchodzącym usunięciu stanu.
- Aby natychmiast usunąć stan, kliknij Wymuś wykonanie.
Powiadomienia
Gdy usługa w tle otrzyma powiadomienie push od serwera, używa interfejsu Notifications API, aby wyświetlić dane użytkownikowi. Aby rejestrować powiadomienia przez 3 dni, nawet gdy Narzędzia deweloperskie są zamknięte:
- Otwórz Narzędzia deweloperskie, na przykład na stronie demonstracyjnej.
Kliknij Aplikacja > Usługi w tle > Powiadomienia i
Nagrywaj.
Na stronie demonstracyjnej kliknij Schedule Notification (Zaplanuj powiadomienie) i kliknij Allow (Zezwól), gdy pojawi się taka prośba.
Poczekaj na pojawienie się powiadomienia. Narzędzie DevTools rejestruje zdarzenia powiadomień w tabeli.
Kliknij zdarzenie, aby wyświetlić jego szczegóły w miejscu poniżej tabeli.
Możesz zamknąć Narzędzia deweloperskie i zostawić nagranie do 3 dni. Aby zatrzymać nagrywanie, kliknij
Zatrzymaj.
Ładowanie spekulacyjne
Ładowania spekulacyjne umożliwiają błyskawiczne wczytywanie stron na podstawie zdefiniowanych przez Ciebie reguł spekulacyjnych. Dzięki temu Twoja witryna może pobierać i renderować wstępnie większość stron, do których użytkownicy się przemieszczają.
Wstępny pobieranie pobiera zasób z wyprzedzeniem, a renderowanie wstępne idzie o krok dalej i renderuje całą stronę w ukrytym procesie renderowania w tle.
Debugowanie ładowania spekulacyjnego możesz przeprowadzić w sekcji Aplikacja > Usługi w tle > Ładowanie spekulacyjne. Sekcja zawiera 3 widoki:
- Ładowanie spekulacyjne. Zawiera stan spekulacyjny bieżącej strony, bieżący adres URL, strony, które bieżąca strona próbuje załadować spekulacyjnie, oraz ich stany.
- Reguły. Zawiera zestawy reguł na bieżącej stronie w panelu Elementy oraz ogólny stan spekulacji.
- Plotki. Zawiera tabelę z informacjami o próbach spekulatywnych wczytywania i ich stanach. Jeśli próba się nie powiodła, możesz kliknąć ją w tabeli, aby wyświetlić szczegółowe informacje i przyczynę niepowodzenia.
Spróbuj debugować ładowanie spekulacyjne na tej stronie demonstracyjnej:
Otwórz DevTools na stronie i kliknij Aplikacja > Usługi w tle > Wstępne wczytywanie. Jeśli nie widzisz żadnych spekulatywnych załadowań zainicjowanych przez stronę, załaduj ją ponownie.
Strona początkowa w demo wstępnie renderuje 2 strony, a nie jedną. Kliknij Wyświetl wszystkie spekulacje.
W sekcji Spory wybierz spór o stanie Niepowodzenie, aby wyświetlić sekcję Przyczyna niepowodzenia z szczegółowymi informacjami u dołu.
W tym przypadku renderowanie wstępne nie powiodło się, ponieważ na stronie nie ma strony
/next3.html.Otwórz sekcję Reguły i kliknij Stan, aby wyświetlić u dołu zestaw reguł. Kliknięcie linku Zestaw reguł powoduje otwarcie panelu Elementy, w którym można zobaczyć, gdzie zdefiniowano regułę spekulacji.
Szczegółowe instrukcje znajdziesz w artykule Rozwiązywanie problemów z regułami spekulacji.
Komunikaty push
Aby wyświetlić powiadomienie push użytkownikowi, skrypt service worker musi najpierw użyć interfejsu PushMessage API, aby otrzymać dane z serwera. Gdy usługa robocza jest gotowa do wyświetlenia powiadomienia, używa interfejsu Notifications API. Aby rejestrować wiadomości push przez 3 dni, nawet gdy Narzędzia deweloperskie są zamknięte:
- Otwórz Narzędzia deweloperskie, na przykład na stronie demonstracyjnej.
Kliknij Aplikacja > Usługi w tle > Powiadomienia push i
Nagrywaj.
Na stronie demonstracyjnej kliknij przełącznik Włącz powiadomienia push, a gdy pojawi się prośba, kliknij Zezwól, wpisz wiadomość i wyślij ją. W tabeli DevTools rejestruje się zdarzenia powiadomień push.
Kliknij zdarzenie, aby wyświetlić jego szczegóły w miejscu poniżej tabeli.
Możesz zamknąć Narzędzia deweloperskie i zostawić nagranie do 3 dni. Aby zatrzymać nagrywanie, kliknij
Zatrzymaj.
Interfejs API do raportowania
Niektóre błędy występują tylko w produkcji. Nigdy nie widzisz ich lokalnie ani podczas tworzenia, ponieważ prawdziwi użytkownicy, sieci i urządzenia zmieniają rozgrywkę.
Załóżmy na przykład, że Twoja nowa witryna korzysta z oprogramowania innej firmy, które używa document.write() do wczytywania ważnych skryptów. Nowi użytkownicy z całego świata otwierają Twoją witrynę, ale mogą mieć wolniejsze połączenie niż to, które było testowane. Nie wiedząc o tym, Twoja witryna zaczyna się dla nich psuć, ponieważ Chrome interweniuje w przypadku document.write() na wolnych sieciach. Możesz też zwracać uwagę na wycofane lub wkrótce wycofywane interfejsy API, których używa Twoja baza kodu.
Interfejs Reporting API pomaga monitorować wycofane wywołania interfejsu API, naruszenia bezpieczeństwa Twojej strony i inne kwestie. Raportowanie możesz skonfigurować zgodnie z instrukcjami podanymi w artykule Monitorowanie aplikacji internetowej za pomocą interfejsu Reporting API.
Aby wyświetlić raporty wygenerowane przez stronę:
- Otwórz
chrome://flags/#enable-experimental-web-platform-features, ustaw Eksperymentalne funkcje platformy internetowej na Włączone i uruchom ponownie Chrome. Otwórz DevTools i kliknij Aplikacja > Usługi w tle > Interfejs API do raportowania. Możesz na przykład sprawdzić raporty na stronie demonstracyjnej.
Karta Interfejs API do raportowania jest podzielona na 3 części:
- Tabela Raporty z tymi informacjami o każdym raporcie:
- URL, który spowodował wygenerowanie raportu
- Typ naruszenia
- Raporty stanu
- Punkt końcowy Destination
- Wygenerowano o godzinie:
- Raport Treść
- Sekcja podglądu Treść raportu. Aby wyświetlić podgląd treści raportu, kliknij raport w tabeli raportów.
- sekcję Punkty końcowe z przeglądem wszystkich punktów końcowych skonfigurowanych w nagłówku
Reporting-Endpoints.
Stan raportu
Kolumna Stan informuje, czy Chrome wysłało raport, czy jest w trakcie wysyłania raportu, czy też wysłanie się nie powiodło.
| Stan | Opis |
|---|---|
Success |
przeglądarka wysłała raport, a punkt końcowy odpowiedział kodem powodzenia (200 lub innym kodem odpowiedzi powodzenia 2xx); |
Pending |
Przeglądarka próbuje wysłać raport. |
Queued |
Raport został wygenerowany, ale przeglądarka nie próbuje go jeszcze wysłać. Raport jest wyświetlany jako Queued w jednym z tych 2 przypadków:
|
MarkedForRemoval |
Po kilku próbach (Queued) przeglądarka przestała próbować wysłać raport i wkrótce usunie go z listy raportów do wysłania. |
Raporty są usuwane po pewnym czasie, niezależnie od tego, czy zostały wysłane.