Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there an easier way to view json object from firefox or chrome's developer console?

What is the easiest way to read json from Firefox or Chrome's developer console? Do I need to install a plugin? Or hopefully there's a javascript function that lets you view json in a way that's much easier to read...

For example. If I try console.log(data) where data is the json object, the developer console displays it like a one huge chunk of string instead of displaying the structure, so it's really hard to sift through and filter out what I want.

EDIT: I apologize for the confusion I caused. I just checked Chrome and it seems Chrome does display JSON in a structured way. However on Firefox it's all jumbled together. I attached the screenshot. I guess the question is "Is there a way to display this in a more structured way like on Chrome?", and as I learned from below, I guess console.dir() takes care of this. Then my last question would be: Is this an intended behavior?

console.log(data) from Firefox

like image 730
Vlad Avatar asked Dec 06 '22 16:12

Vlad


2 Answers

Firebug and Webkits developer tools display any object, structured and well readable. It seems like you try to output a JSON string instead an object. If thats the case, just parse it into an object before

console.log( JSON.parse( data ) );

and by the way, there are lots of neat methods on the console object, like console.dir() which directly lists an object properties/keys.

like image 53
jAndy Avatar answered Jan 10 '23 12:01

jAndy


There are no JSON objects.

There are

  • Javascript object

  • JSON data as Javascript string

If you want to display JSON as string in an easily browseable manner do

  var obj = JSON.parse(jsonstring);
  console.log(obj)
like image 33
Mikko Ohtamaa Avatar answered Jan 10 '23 12:01

Mikko Ohtamaa