How to view Formatted JSON in Microsoft Edge Browser ?

JSON ( JavaScript Object Notation) is a lightweight data exchange format that is easily readable writable and easy for machines to parse and generate. We need to view it in a formatted way to make it more readable and understandable. In this article, we will understand how to view formatted JSON in the Microsoft Edge web browser.

How to View Formatted JSON in Microsoft Edge?

Microsoft Edge comes with a built-in feature that allows you to view formatted JSON. Follow the steps :

Step 1: Open a new tab or window in Microsoft Edge

👁 ezgifcom-video-to-gif(27)

Step 2: Type a URL that returns JSON data in the address bar (Find some dummy files here) and Microsoft Edge detects the returned data is JSON and automatically formats it.

👁 ezgifcom-video-to-gif

Detection of Invalid JSON on Edge:

Step 1: Open the JSON file with Error on Edge and Go to Console tab on Developer tools to check the Error

👁 ezgifcom-video-to-gif(1)

Note : Sometimes you may need to enable JSON Formatter going to this link to view the formatted JSON data.

Different ways to view JSON in edge browser:

1. View as Text (The above Method is the example):

• Open a JSON file or navigate to a webpage that returns JSON data.
• The Edge browser will display the raw JSON data as plain text.

Example : The above mentioned steps is the good example.

2. Use Developer Tools:

• Right-click on the page, select "Inspect," and go to the "Network" tab.
• Reload the page.
• Look for the request that returned JSON data, click on it, and view the JSON content in the "Response" tab.

Example : Open some site requesting for JSON data (Filter using Fetch/XHR tab). Here is the example with jsonviewer.stack.hu opening online JSON file.

👁 ezgifcom-video-to-gif(8)

3. Online JSON Viewer:

• Copy some JSON data.
• Go to an online JSON viewer such as jsonviewer.stack.hu.
• Paste the JSON data into the viewer to see a formatted and interactive representation.

Example : Loading https://microsoftedge.github.io/Demos/json-dummy-data//64KB.json on jsonviewer.stack.hu.

👁 ezgifcom-video-to-gif(7)

Features and Benefits:

1. Formatted JSON is easier to read and understand when dealing with complex and nested data structures.
2. Formatted JSON helps quickly identify syntax errors or unexpected structures in the data.
3. Developers can use formatted JSON for debugging purposes as it provides a clear overview of the data being processed.

Conclusion:

Formatted JSON in Microsoft Edge is a handy feature for web developers and anyone working with JSON data. It improves the overall experience of inspecting and understanding the structure of JSON objects. We learnt to make JSON data more accessible and save time in the process so that if you find yourself in need of inspecting JSON in Microsoft Edge these steps will make your development journey smoother.