Запит моніторингу в Chrome


208

У Firefox я використовую Firebug, який дозволяє мені переглядати кожен запит http, який здійснюють мої дзвінки Ajax. Я перейшов на розробку до Chrome і мені до вподоби. Однак, моя єдина скарга - це те, що інструменти для розробників не дозволяють переглядати кожен запит ajax. У мене це траплялося один раз, коли панель "Ресурси" показувала кілька запитів на один і той же ресурс, але це робиться лише один раз і ніколи більше.

Чи є спосіб надійно побачити кожен запит http, який сторінка робить через JavaScript з Chrome?

[Редагувати: 30.11.9 11:55]

В даний час, щоб обійти це, я запускаю Fiddler поруч із Chrome для перегляду моїх запитів, але якщо є спосіб зробити це з браузера, я вважаю за краще це.


2
У мене така ж проблема - спробував усі рішення тут. Нічого не з'являється у частині Response у вікні XHR у інструментах розробки. Він просто показує "У цього запиту відсутні дані відповіді". Якщо я запускаю той самий код за допомогою firebug, він відображається нормально. у налаштуваннях інструментів для розробки зубців я спробував позначити "Журнал XMLHttpRequest", але це не допомогло (тип відповіді - застосунок / json). Я маю зробити всі налагодження у firebug. Firebug також добре форматує JSON, хромовані інструменти для розробників не роблять, якщо ви можете отримати його для відображення відповіді (наприклад, не використовуючи ajax).
Джон Літл

Відповіді:


359

Я знаю, що це стара нитка, але я думав, що я задзвонюся.

Зараз у Chrome вбудовано рішення.

  1. Використовуйте CTRL+SHIFT+I(або перейдіть до Current Page Control > Developer > Developer Tools. У нових версіях Chrome натисніть значок гайкового ключа> Інструменти> Інструменти для розробників.), Щоб увімкнути Інструменти для розробників.
  2. Зсередини інструментів розробника натисніть Networkкнопку. Якщо цього ще немає, увімкніть його для сеансу або завжди.
  3. Натисніть "XHR"підпункт.
  4. Ініціювати AJAX call.
  5. Ви побачите елементи, які починають відображатися в лівій колонці під "Resources".
  6. Клацніть ресурс, і там є дві вкладки, де відображаються заголовки та повертається вміст.

2
Дякую Філу! Я відклав це і покладався здебільшого на Фіддлера. Але ця кнопка XHR - це те, що я шукав: D
Wes P

тільки вчора я говорив, що якби хромовані інструменти могли це зробити, це було б ідеально, дякую.
Герман Родрігес

3
Привіт усім, спробуйте знайти "XHR підпункт". Я думаю, я, можливо, цього не вистачає, може хтось скаже мені, де це? ось так виглядає мій інспектор imgur.com/9e6yDcB
Девід Вільямс

2
Здається, це трапляється лише в тому випадку, якщо на дзвінок AJAX надійде відповідь, але він не відображає вам вихідний запит, який може не очікувати відповіді. Хтось знає, як це зробити?
MoMo

1
Якщо сторінка переспрямовується у тому самому вікні, ви можете використовувати прапорець «Зберегти журнал» у верхній частині параметрів вкладки мережі (якщо ні, ви можете змінити посилання, щоб відкрити в тому ж вікні, встановивши target='_self'). Тоді, наприклад, ви можете побачити відповідь із форми, яку ви надіслали після того, як вас переспрямує. Не забудьте також помітити фільтр, коли відповіді накопичуються при завантаженні нової сторінки.
JeremyS

57

Найсвіжіша відповідь на це: вони перераховані під кнопкою "Мережа" в інструментах для розробників, а не під "Ресурси", як це було раніше.


5
Це дійсно там, де він зараз, взяв мене за пошук переповнення стека, щоб знайти його після оновлення.
Kzqai

42

Оновлення

Chrome змінив спосіб перевірки запитів і пропонує тепер використовувати Catapult Netlog Viewer з журналами, експортованими з chrome: // net-export /

chrome://net-export/

Більше інформації

Старі версії Chrome

Ви також можете використовувати це посилання в Chrome для отримання більш детальної інформації, ніж це робив інспектор.

chrome://net-internals/#events

Це показує журнал усіх запитів браузера під час відкриття


Чи можете ви експортувати це?
Pacerier

14

не знаю, для якої хромованої версії це доступно, але я знайшов налаштування "Консоль - журнал XMLHttpRequests" (натиснувши на іконку в правому нижньому куті інструментів розробника в chrome на mac)


3
Це найпростіший і найкращий спосіб контролювати запити XHR.
CourtDemone

6

Відкрийте свій DevTools і натисніть F1, щоб отримати доступ до налаштувань. Знайдіть розділ консолі та встановіть прапорець "Увійти XMLHttpRequests".

Тепер усі ваші програми ajax та інші подібні запити будуть записані в консолі.

Я віддаю перевагу цьому методу, тому що він зазвичай дозволяє мені бачити все, що я шукаю в консолі, не переходячи на вкладку мережі.


4

Ви можете використовувати Fiddler, який є хорошим безкоштовним інструментом.


1
Так, у мене є Fiddler, для чого я це роблю. Просто шукайте спосіб це зробити з браузера, оскільки це трохи зручніше.
Уес П

3

Дякуємо всім, хто намагається допомогти у цій публікації

У мене є ubuntu 13.10, а моя хромована версія - 34.0

Для моєї ситуації це працює

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

тепер ви повинні побачити нову панель перед вашим запитом

in this panel select "Response" tab

1

На кроці 5 Філа "Ресурси" більше не доступні в новій версії Chrome. Потрібно натиснути піктограму сторінки поруч зі сторінкою Ajax, вказаною на нижній панелі зі стовпцями Ім'я, Метод, Стан, ...

Тоді він покаже вам більше панелей, де ви знайдете повідомлення про помилки.


0

Ви також можете просто клацнути правою кнопкою миші на сторінці в браузері та вибрати "Перевірити елемент", щоб відкрити інструменти для розробників.

https://developer.chrome.com/devtools

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.