Запросить мониторинг в Chrome

209

В Firefox я использую Firebug, который позволяет мне просматривать каждый http-запрос, который делают мои ajax-вызовы. Я переключил свою разработку на Chrome, и мне она пока нравится. Моя единственная жалоба, однако, заключается в том, что инструменты разработчика не позволяют просматривать каждый ajax-запрос. У меня это было однажды, когда панель «Ресурсы» показала несколько запросов к одному и тому же ресурсу, но это было сделано только один раз и никогда больше.

Есть ли способ надежно увидеть каждый http-запрос, который страница делает через javascript из Chrome?

[Редактировать: 30.11.09 11:55]

В настоящее время, чтобы обойти это, я запускаю Fiddler рядом с Chrome для просмотра моих запросов, но если есть способ сделать это из браузера, я бы предпочел это.

ajax google-chrome httprequest Уэс П
источник
2
У меня та же проблема - я попробовал все решения здесь. Ничего не появляется в части ответа окна XHR в инструментах разработки. Он просто показывает «Этот запрос не имеет доступных данных ответа». Если я запускаю тот же код с помощью Firebug, он показывает нормально. в настройках инструментов разработчика Cog я попытался поставить галочку «Log XMLHttpRequest», но это не помогло (тип ответа - application / json). Я должен сделать все отладки в firebug. Firebug также хорошо форматирует JSON, Chrome Dev Tools не делает, если вы можете заставить его отображать ответ (например, не используя 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 вкладки, показывающие заголовки и возвращаемый контент.
Фил
источник
2
Спасибо, Фил! Я отложил это в сторону и полагался в основном на Фиддлера. Но эта кнопка XHR - это то, что я искал: D
Wes P
только вчера я говорил, что если бы инструменты Chrome могли это сделать, это было бы прекрасно, спасибо.
Герман Родригес
3
Привет всем, попробую найти «XHR sub-button» Я думаю, что я могу пропустить это, кто-то может сказать мне, где это? Вот так
Дэвид Уильямс
2
Похоже, это происходит только в том случае, если вызов AJAX получает ответ, но не показывает исходящий запрос, который может не ожидать ответа. Кто-нибудь знает, как включить это?
MoMo
1
Если страница перенаправляется в том же окне, вы можете использовать флажок «Сохранить журнал» в верхней части параметров вкладки сети (если нет, вы можете изменить эту ссылку, чтобы открыть в том же окне, установив target='_self'). Затем, например, вы можете увидеть ответ из формы, которая была отправлена ​​после перенаправления вас. Обязательно обратите внимание на фильтр, поскольку ответы накапливаются при загрузке новых страниц.
JeremyS
57

Наиболее актуальный ответ на этот вопрос таков: они перечислены под кнопкой «Сеть» в инструментах разработчика, а не под «Ресурсами», как это было раньше.

Wouter
источник
5
Это действительно то место, где оно сейчас находится, я взял поиск переполнения стека, чтобы найти его после обновления.
Kzqai
42

Обновить

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

chrome://net-export/

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

Старые версии Chrome

Вы также можете использовать эту ссылку в Chrome для получения более подробной информации, чем это сделал инспектор.

chrome://net-internals/#events

Это показывает журнал всех запросов браузера при открытом

Карл Адлер
источник
Не могли бы вы экспортировать это?
Pacerier
14

Я не знаю, для какой версии Chrome это доступно, но я нашел параметр «Консоль - Журнал XMLHttpRequests» (нажав на значок в правом нижнем углу инструментов разработчика в Chrome для Mac)

schellmax
источник
3
Это самый простой и лучший способ отслеживать запросы XHR.
CourtDemone
6

Откройте DevTools и нажмите F1, чтобы получить доступ к настройкам. Найдите раздел консоли и установите флажок «Журнал XMLHttpRequests».

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

Я предпочитаю этот метод, потому что он обычно позволяет мне видеть все, что я ищу, в консоли, не переходя на вкладку сети.

ShaneDaugherty
источник
4

Вы можете использовать Fiddler, который является хорошим бесплатным инструментом.

JoshBerke
источник
1
Да, у меня есть Fiddler, который я использую для этого. Просто ищу способ сделать это из браузера, так как это немного удобнее.
Wes P
3

Спасибо всем, кто пытается помочь в этом посте

У меня Ubuntu 13.10 и моя версия Chrome 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
masoud2011
источник
1

На шаге 5 Фила «Ресурсы» больше не доступны в новой версии Chrome. Вам нужно щелкнуть значок страницы рядом со страницей Ajax, перечисленной в нижней панели со столбцами Имя, Метод, Статус, ...

Затем он покажет вам больше панелей, где вы найдете сообщения об ошибках.

wcb1
источник
0

Вы также можете просто щелкнуть правой кнопкой мыши на странице в браузере и выбрать «Проверить элемент», чтобы открыть инструменты разработчика.

https://developer.chrome.com/devtools

BitByteDog
источник