How do I fetch JSON from the server using Fetch API?

To get JSON from the server using the Fetch API, you can use the response.json() method. The response.json() method reads the data returned by the server and returns a promise that resolves with a JSON object. If you are expecting a text, call the response.text() method. The response.json() method returns a promise, which we need to chain another then() call to wait for that promise to complete. In this JavaScript get JSON with Fetch API example, we retrieve a JSON from ReqBin echo URL. Click Execute to run the JavaScript Fetch JSON Example online and see the result.
How do I fetch JSON from the server using Fetch API? Execute
fetch('https://reqbin.com/echo/get/json')
   .then(response => response.json())
   .then(json => console.log(json))
Updated: Viewed: 2758 times

What is JSON?

JavaScript Object Notation (JSON) is a language-independent text format for storing and exchanging data. Web applications use JSON to exchange data between a web browser and a server and exchange data between servers via REST API. For many programming languages, including JavaScript, Java, C ++, C #, Go, PHP, and Python, there are ready-made code libraries for creating and manipulating JSON data. JSON file names use the .json file extension.

JSON Example
{
  "Id": 78912,
  "Customer": "Jason Sweet",
  "Quantity": 1,
  "Price": 18.00
}

JavaScript Fetch JSON Example

Below are example of getting JSON using Fetch API from the ReqBin echo URL.

JavaScript Get JSON with Fetch API Example
fetch('https://reqbin.com/echo/get/json')
   .then(response => response.json())
   .then(json => console.log(json))
  
// output: {"success":"true"}

See also