Google Chrome отображает ответ JSON AJAX в виде дерева, а не в виде простого текста

215

Я не могу найти ответ на этот вопрос:

Мои AJAX-вызовы возвращают данные JSON. В Google Chrome Developer Tools> Resources> XHR, когда я щелкаю ресурс слева, а затем на вкладке «Содержимое», я вижу строку JSON в виде строки, а не в виде дерева, как это делают Firebug и Firebug Lite.

Как заставить Chrome отобразить его как дерево? Есть ли у меня тип контента, который должен иметь мой PHP-файл ???

Я был бы рад узнать ответ!

Спасибо Стефанос

ajax json google-chrome view tree GRboss
источник
Ответ @Matt McClure ниже - это ответ!
млрд.куб.м
У меня также были проблемы с получением древовидной структуры, когда строки представляют собой одинарные кавычки "вместо двойных кавычек", поменяв "на" помогло
Мэтт

Ответы:

427

Чтобы увидеть древовидное представление в последних версиях Chrome:

Перейдите к Инструментам разработчика> Сеть> данный ответ> Предварительный просмотр

Мэтт МакКлюр
источник
105
Полностью скрыл вкладку «Предварительный просмотр» и просматривал вкладку «Ответ». Спасибо!
Тед Нейлид
8
Но я думаю, чтобы получить это, вам нужно иметь правильный тип контента.
alexserver
4
Да, вам нужен правильный тип содержимого application / json, указанный для chrome, чтобы вы могли раскрыть раскрывающийся список.
tweak2
5
Это действительно немного менее интуитивно понятно, потому что на вкладке «Заголовки» они позволяют нам переключаться между «сырым» и «анализируемым», поэтому можно ожидать, что они предложат аналогичное «проанализированное» представление на вкладке «Ответ».
Г. Стойнев,
1
Я хотел бы, чтобы это был JSON вместо дерева
Simon_Weaver
57

Google Chrome теперь поддерживает это (Developer Tools > Network > [XHR item in list] Preview ).

Кроме того, вы можете использовать сторонний инструмент для форматирования содержимого json. Вот тот, который представляет древовидное представление, а вот другой, который просто форматирует текст (и выполняет проверку).

Тревор
источник
6

Правильный тип содержимого для данных JSON является application/json. Я предполагаю, что это то, что вам не хватает.

Quentin
источник
6
К сожалению, это по-прежнему не заставляет Chrome превращать строку JSON в дерево. Спасибо хоть!
GRboss
3

Я нашел ответ:

Вы ДОЛЖНЫ кодировать свой JSON следующим образом: {"c":21001,"m":"p"}но не {c:21001,m:"p"}или{'c':21001,'m':'p'}

Таким образом, ключ dict должен быть заключен в двойные кавычки: "тогда chrome будет просматривать его как json, а не как обычный текст.

Бингян Лю
источник
7
Это потому, что первый является допустимым JSON, а другие - нет (хотя они являются допустимым javascript). См. Simonwillison.net/2006/oct/11/json
Styfle
2

Чтобы он правильно отображал сообщение JSON, он должен иметь тип mime «application / json» и быть правильно структурированным.

Вы можете проверить структуру здесь

Мариана Б.
источник
1

Была проблема со сборкой Google Chrome Dev build 24.0.1312.5, из-за которой на панели предварительного просмотра больше не отображалось дерево объектов json, а отображался плоский текст. Это должно быть исправлено в следующем dev

Подробнее здесь: http://code.google.com/p/chromium/issues/detail?id=160733

JeffBaumgardt
источник
0

Я не уверен, что Chrome добавил эту функцию с момента последнего ответа, но я смог просмотреть ответ json по ...

  • открытие инструментов разработчика в браузере на странице с запросом
  • отправка запроса
  • в инструментах разработчика - вкладка «Консоль» - нажмите на дерево «Объект» под ресурсом, чтобы развернуть

... Мне удалось увидеть ответ как читаемую иерархию, которая показала, что просить и что возвращается. (Ни на вкладке «Сеть», ни на «Ресурсах» не было ничего полезного, что я смог найти.)

Счастливого запроса!

Дебора
источник
-1

Вы можете использовать расширение Google Chrome: JSONView все отформатированные результаты json будут отображаться непосредственно в браузере.

Куанг Ву
источник
2
ОП спросил конкретно о коде json, показанном внутри инструментов разработчика.
выезд