




Dotyczy wersji: N/A; autor: Filip Janiga
Wprowadzenie
W niektórych przypadkach do diagnozy błędów pojawiających się w WEBCON BPS Portal potrzebne mogą być logi wykraczające poza sesje diagnostyczne oraz zdarzenia zapisywane w bazie danych. Z pomocą przychodzą tutaj informacje zapisywane w przeglądarce: dane z konsoli programisty i pliki HAR. Niniejszy artykuł zawiera instrukcje generowania i zapisywania wymienionych logów na najpopularniejszych przeglądarkach: Microsoft Edge, Google Chrome, Opera oraz Mozilla Firefox.
Konsola
Logi w konsoli przeglądarki to komunikaty, które pomagają w monitorowaniu działania stron internetowych i aplikacji. Zawierają informacje zapisywane przez programistów, takie jak dane o stanie aplikacji, wyniki działań, błędy, czy ostrzeżenia. Dane zapisane w tym miejscu umożliwiają diagnozę problemów z warstwą prezentacyjną aplikacji oraz niektórych błędów związanych z połączeniami.
Przeglądarki Edge, Chrome oraz Opera są oparte na tym samym silniku – Chromium – dlatego narzędzia programistyczne (devTools) różnią się między nimi w bardzo niewielkim stopniu. W związku z tym pobieranie logów ze wszystkich trzech przeglądarek zostało opisane na jednym przykładzie – Chrome.
Edge, Chrome, Opera:
- Otwórz narzędzia deweloperskie przy pomocy klawisza F12 lub skrótu klawiszowego Ctrl+Shift+I i przejdź do zakładki „Konsola”.
- Wyczyść zawartość konsoli, wciskając przycisk czyszczenia konsoli lub używając skrótu Ctrl+L.
- Odtwórz problem występujący w systemie – logi zostaną odłożone w konsoli.
- Zapisz utworzone logi, klikając na nich prawym przyciskiem myszy, a następnie „Zapisz jako…” i zapisz dane do pliku LOG lub pliku tekstowego.
Rys. 1. Opis konsoli przeglądarki Chrome
Firefox:
- Otwórz narzędzia programistyczne przy pomocy klawisza F12 i przejdź do zakładki „Konsola”.
- Wyczyść logi przy użyciu przycisku „Wyczyść zawartość konsoli WWW”.
- Odtwórz problem występujący w systemie – logi zostaną odłożone w konsoli.
- Zapisz utworzone logi, klikając na nich prawym przyciskiem myszy, a następnie „Zapisz wszystkie komunikaty do pliku” i zapisz dane do pliku tekstowego.
Rys. 2. Opis konsoli przeglądarki Firefox
Tak zapisane logi stanowią podstawę do analizy problemów występujących na formularzu w Portalu.
Pliki HAR
Pliki HAR (HTTP Archive) to pliki, które zapisują szczegółowe informacje o ruchu sieciowym pomiędzy przeglądarką a odwiedzaną stroną internetową. Dzięki nim można dokładnie zobaczyć, jakie dane są przesyłane podczas ładowania strony, jak długo trwa ładowanie poszczególnych elementów oraz czy występują błędy w komunikacji. W plikach HAR zapisywane jest wszystko, co dzieje się podczas ładowania i działania strony, dzięki czemu możliwa jest analiza i diagnoza potencjalnych problemów.
Podobnie jak w przypadku konsoli, w związku z podobieństwami pomiędzy Edge, Chrome i Operą, te przeglądarki zostały opisane w jednym punkcie. Zrzut ekranu wykonano w przeglądarce Chrome.
Edge, Chrome, Opera:
- Otwórz narzędzia programistyczne przy pomocy klawisza F12 i przejdź do zakładki „Sieć”.
- Wyczyść logi, wciskając przycisk czyszczenia logu sieciowego lub używając skrótu Ctrl+L.
- Upewnij się, że ruch sieciowy jest nagrywany – przyciska nagrywania powinien być czerwony.
- Odtwórz problem występujący w systemie – informacje o ruchu sieciowym zostaną zapisane w logach.
- Zapisz utworzone logi, wciskając przycisk „Eksportuj plik HAR” lub używając skrótu klawiszowego Ctrl+S.
Rys. 3. Opis zakładki "Sieć" przeglądarki Chrome
Firefox:
- Otwórz narzędzia deweloperskie i przejdź do zakładki „Sieć”.
- Wyczyść zapisane logi naciskając na ikonę kosza.
- Upewnij się, że ruch sieciowy jest nagrywany – informuje o tym ikona „Wstrzymaj/Wznów rejestrowanie dziennika sieci” – znak pauzy oznacza nagrywanie.
- Odtwórz problem występujący w systemie – informacje o ruchu sieciowym zostaną zapisane w logach.
- Zapisz utworzone logi, wciskając ikonę koła zębatego, a następnie wybierając opcję „Zapisz wszystko jako HTTP Archive”.
Rys. 4. Opis zakładki "Sieć" przeglądarki Firefox
Przy zapisywaniu pliku HAR konieczne może okazać się wyłączenie pamięci podręcznej przeglądarki. Można to zrobić zaznaczając pole „Wyłącz pamięć podręczną”. To ustawienie zasymuluje przywrócenie przeglądarki do ustawień domyślnych.
Podsumowanie
Zapisane zgodnie z instrukcją logi pozwalają na dokładny wgląd w zachowanie przeglądarki w czasie pracy z WEBCON BPS. Tak zebrane dane są podstawą do analizy i diagnozy problemów pojawiających się w WEBCON BPS Portal.