Просмотр HTML-ответа от вызова Ajax с помощью инструментов разработчика Chrome? - PullRequest
Новая
       12

Просмотр HTML-ответа от вызова Ajax с помощью инструментов разработчика Chrome?

18 голосов
/ 05 июля 2010

Так что в моем javascript я делаю ajax-вызов в службу на моем сайте.Упс, что-то не получается.Нет проблем.Вот что я бы сделал в Firefox:

  1. Откройте консоль firebug
  2. Найдите неудачный вызов Ajax и нажмите знак +, чтобы увидеть больше информации.
  3. вкладка ответа имеет необработанный HTML.Кто хочет все это прочитать?Я щелкаю вкладку HTML.
  4. Ах, красиво отформатированный HTML, возвращенный Django, показывает мою ошибку деления на ноль.

Теперь вот что я сейчас делаю в Chrome:

  1. Ctrl + Shift + J, чтобы открыть Инструменты разработчика
  2. Перейти к ресурсам
  3. Прокрутите вниз до вызова Ajax и нажмите
  4. Еще раз, я вижу rawHTML.Все еще не хочу читать все это, но так как нет вкладки HTML, я копирую и вставляю в текстовый редактор.
  5. Сохранение файла HTML
  6. Открытие файла HTML в браузере, чтобы яможет прочитать ошибку HTML, возвращенную Django

Итак, к вопросу.Есть ли способ просмотреть ответ HTML от вызова Ajax, отображаемого в браузере, без необходимости копировать и вставлять необработанный HTML в текстовый редактор?

Ответы [ 6 ]

6 голосов
/ 06 июля 2010

Нет, в настоящее время нет способа. Когда вы идете в Инструменты разработчика> Ресурсы> Вкладка XHR> И нажимаете на свой ресурс (слева), вы видите две вкладки. Первый - это заголовки (которые являются необработанными) и контент, который также является необработанными.

4 голосов
/ 21 июля 2010

Только для вашей информации, в то время как Firebug Lite не имеет панель NET, он имеет функцию XHR-наблюдателя с тем же внешним видом и ощущением, что и Firebug.Конечно, Firebug Lite очень ограничен по сравнению с Chrome Developer Tools, но для некоторых конкретных задач, таких как редактирование CSS или проверка XHR, Firebug Lite отлично справляется со своей задачей.

Текущая стабильная версия показывает заголовки HTTP,Переменные GET и POST и текст ответа.Но следующая версия 1.3.1 (которая будет выпущена в ближайшее время) включает в себя средство просмотра HTML, средство просмотра XML и удобный просмотрщик JSON (как для данных запроса, так и для ответа).

Эта функция будет включена в следующий выпуск1.3.1b2 (возможно, последняя бета-версия для версии 1.3.1), но если вы хотите, чтобы она работала прямо сейчас, вы можете использовать канал разработчика .

2 голосов
/ 02 июня 2015

Щелкните правой кнопкой мыши по запрашиваемой ссылке на вкладке консоли в Firebug. Затем щелкните правой кнопкой мыши и выберите открыть ответ в новой вкладке. Вы увидите это как HTML.

2 голосов
/ 07 февраля 2012

Да, самый простой способ - использовать вкладку Сеть в Инструментах разработчика.

  1. Ctrl + Shift + I, чтобы открыть Инструменты разработчика (или использовать строку меню вверху: «Просмотр-> Разработчик -> Инструменты разработчика ")
  2. Перейти на вкладку" Сеть "
  3. Обновить текущую страницу
  4. Прокрутите вниз до вызова Ajax слева и нажмите
  5. В главном меню будет отображаться несколько вкладок (обычно по умолчанию используется предварительный просмотр).Нажмите «Заголовки», и вы увидите информацию заголовка запроса и ответа.
1 голос
/ 18 сентября 2012

Поскольку я заметил, что возможность щелчка правой кнопкой мыши "сохранить как" больше не существует на вкладке "Сеть> XHR> ответ ..." Я создал новый сценарий автоматической горячей клавиши: (щелкните среднюю кнопку мыши на тексте ответа) 

MButton::
MouseClick, left
ClipSaved := ClipboardAll
Send, ^a^c
sleep, 500
FileName := "C:\Users\David\Desktop\temp_xhr_response.html"
file := FileOpen(FileName, "w")
if !IsObject(file)
{
MsgBox Can't open "%FileName%" for writing.
return
}
StringGetPos, pos, Clipboard, HeadersPreviewResponseCookiesTiming
if pos = -1
{
pos = 0 
}
TestString := SubStr(Clipboard, pos+38)
file.Write(TestString)
file.Close()
Run, open "C:\Users\David\Desktop\temp_xhr_response.html"
Clipboard = %ClipSaved%
sleep, 1000
FileDelete, C:\Users\David\Desktop\temp_xhr_response.html
return
0 голосов
/ 10 марта 2012

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

Вот сценарий, который я написал в autohotkey , что если вы нажмете среднюю кнопку мыши (кнопку колесика мыши) внутри этого окна ответов на вкладке «Инструменты разработчика» Chrome> вкладка «Сеть», она выполнит следующие шаги:

  1. Щелкните правой кнопкой мыши ... щелкните Сохранить как
  2. Вставьте местоположение файла в подсказку и нажмите Enter
  3. Открыть файл (использует браузер по умолчанию)

  4. Удалить файл 

    MButton::
MouseClick, right
MouseGetPos, xpos, ypos
xpos := xpos + 5
ypos := ypos + 5
MouseMove, xpos, ypos
MouseClick, left
Sleep, 500
ClipSaved := ClipboardAll
Clipboard := "C:\Users\David\Desktop\temp_xhr_response.html"
Send, ^v  {Enter}
Clipboard = %ClipSaved%
sleep, 500
Run, open "C:\Users\David\Desktop\temp_xhr_response.html"
sleep, 1000
FileDelete, C:\Users\David\Desktop\temp_xhr_response.html
return

Это должно держать вас до тех пор, пока Google не выпустит обновление для лучшего просмотра ответов HTML. Я больше не использую FireBug FF, он стал невероятно медленным!

...