Poproś o monitorowanie w Chrome

208

W Firefoksie używam Firebug, który pozwala mi przeglądać każde żądanie http, które wykonuję wywołania ajax. Zmieniłem swój rozwój na Chrome i jak dotąd go lubię. Moją jedyną skargą jest jednak to, że narzędzia programistyczne nie pozwalają na przeglądanie każdego żądania ajax. Zdarzyło mi się to raz, gdy panel Zasoby pokazał wiele żądań do tego samego zasobu, ale zrobił to tylko raz i nigdy więcej.

Czy istnieje sposób, aby niezawodnie widzieć każde żądanie http, które strona wysyła za pomocą javascript z poziomu Chrome?

[Edytuj: 30.11.09 11:55]

Obecnie, aby obejść ten problem, uruchamiam Fiddler obok Chrome, aby wyświetlić moje prośby, ale jeśli jest na to sposób z poziomu przeglądarki, wolałbym to.

ajax google-chrome httprequest Wes P.
źródło
2
Mam ten sam problem - wypróbowałem wszystkie rozwiązania tutaj. Nic nie pojawia się w części Odpowiedź okna XHR w narzędziach programistycznych. Pokazuje tylko „To żądanie nie ma dostępnych danych odpowiedzi”. Jeśli uruchomię ten sam kod za pomocą firebuga, pokaże się dobrze. w ustawieniach narzędzi Cog Dev próbowałem zaznaczyć „Log XMLHttpRequest”, ale to nie pomogło (typ odpowiedzi to application / json). Muszę robić wszystkie debugowanie w Firebug. Firebug ładnie formatuje również JSON, narzędzia chrome dev nie działają, jeśli można go wyświetlić w celu wyświetlenia odpowiedzi (np. Nie używając ajax).
John Little

Odpowiedzi:

359

Wiem, że to stary wątek, ale pomyślałem, że się wślizgnę.

Chrome ma obecnie wbudowane rozwiązanie.

  1. Użyj CTRL+SHIFT+I(lub przejdź do Current Page Control > Developer > Developer Tools. W nowszych wersjach Chrome kliknij ikonę Klucz> Narzędzia> Narzędzia dla programistów), aby włączyć Narzędzia dla programistów.
  2. Z poziomu narzędzi programistycznych kliknij Networkprzycisk. Jeśli nie jest jeszcze włączony, włącz go dla sesji lub zawsze.
  3. Kliknij przycisk "XHR"podrzędny.
  4. Zainicjować AJAX call.
  5. Zobaczysz elementy zaczną się pojawiać w lewej kolumnie pod "Resources".
  6. Kliknij zasób, a są 2 zakładki pokazujące nagłówki i zwracaną treść.
Phil
źródło
2
Dzięki Phil! Odłożyłem to na bok i polegałem głównie na Fiddler. Ale tego przycisku XHR szukałem: D
Wes P
jeszcze wczoraj mówiłem, że jeśli narzędzia Chrome mogłyby to zrobić, byłoby idealnie, dziękuję.
Germán Rodríguez
3
Cześć wszystkim, próbuję znaleźć „podklucz XHR”. Myślę, że go brakuje, czy ktoś może mi powiedzieć, gdzie to jest? tak wygląda mój inspektor imgur.com/9e6yDcB
David Williams
2
Wydaje się, że dzieje się tak tylko wtedy, gdy połączenie AJAX otrzyma odpowiedź, ale nie pokazuje żądania wychodzącego, które może nie oczekiwać odpowiedzi. Czy ktoś wie, jak to włączyć?
MoMo
1
Jeśli strona przekierowuje w tym samym oknie, możesz użyć pola wyboru „Zachowaj dziennik” u góry opcji karty sieci (jeśli nie, możesz zmienić ten link, aby otworzyć w tym samym oknie, ustawiając target='_self'). Następnie możesz na przykład zobaczyć odpowiedź z formularza przesłanego po przekierowaniu. Pamiętaj też, aby zauważyć filtr, gdy odpowiedzi gromadzą się przy ładowaniu nowych stron.
JeremyS,
57

Najbardziej aktualna odpowiedź na to pytanie: są one wymienione pod przyciskiem „Sieć” w narzędziach programistycznych, a nie pod „Zasobami”, tak jak kiedyś.

Wouter
źródło
5
Właśnie tam jest teraz, zajęło mi wyszukiwanie przepełnienia stosu, aby go znaleźć po aktualizacji.
Kzqai,
42

Aktualizacja

Chrome zmienił sposób sprawdzania żądań i sugeruje teraz korzystanie z Catapult Netlog Viewer z dziennikami eksportowanymi z chrome: // net-export /

chrome://net-export/

Więcej informacji

Stare wersje Chrome

Możesz także użyć tego linku w Chrome, aby uzyskać bardziej szczegółowe informacje niż zrobił to inspektor.

chrome://net-internals/#events

Pokazuje dziennik wszystkich żądań przeglądarki podczas jej otwarcia

Karl Adler
źródło
Czy możesz to wyeksportować?
Pacerier,
14

nie wiem, która wersja chrome jest dostępna, ale znalazłem ustawienie „Console - Log XMLHttpRequests” (kliknięcie ikony w prawym dolnym rogu narzędzi programistycznych w chrome na Macu)

schellmax
źródło
3
Jest to najłatwiejszy i najlepszy sposób monitorowania żądań XHR.
CourtDemone
6

Otwórz DevTools i naciśnij F1, aby uzyskać dostęp do ustawień. Poszukaj sekcji konsoli i zaznacz pole wyboru „Log XMLHttpRequests”.

Teraz wszystkie Twoje ajax i inne podobne żądania będą rejestrowane w konsoli.

Wolę tę metodę, ponieważ zwykle pozwala mi zobaczyć wszystko, czego szukam w konsoli, bez konieczności przechodzenia do karty sieci.

ShaneDaugherty
źródło
4

Możesz użyć Fiddler, który jest dobrym darmowym narzędziem.

JoshBerke
źródło
1
Tak, mam skrzypek, którego używam do tego. Po prostu szukam sposobu, aby to zrobić z poziomu przeglądarki, ponieważ jest to nieco wygodniejsze.
Wes P
3

Dziękujemy wszystkim osobom, które próbują pomóc w tym poście

Mam Ubuntu 13.10, a moja wersja Chrome to 34.0

W mojej sytuacji to działa

1.open developer tools in chrome(or use right click on your page and then select inspect element)
2.go to "Network" tab
3.find your ajax request in "Name Path" column 
4.click on the specific ajax link

teraz powinieneś zobaczyć nowy panel przed twoją prośbą 

in this panel select "Response" tab
masoud2011
źródło
1

W kroku 5 Phila „Zasoby” nie są już dostępne w nowej wersji Chrome. Musisz kliknąć ikonę strony tuż obok strony Ajax wymienionej w dolnym okienku z kolumnami Nazwa, Metoda, Status, ...

Następnie pokaże więcej paneli, w których znajdziesz komunikaty o błędach.

wcb1
źródło