How to get JSON from URL in JavaScript

Question

This URL returns JSON       query        count  1      created   2015-12-09T17 12 09Z       lang   en-US       diagnostics                      I tried this  and it didn t work   responseObj   readJsonFromUrl  http   query yahooapis com v1 publ       var count   responseObj query count   console log count     should be 1   How can I get a JavaScript object from this URL s JSON response

User · Answer

With Chrome  Firefox  Safari  Edge  and Webview you can natively use the fetch API which makes this a lot easier  and much more terse    If you need support for IE or older browsers  you can also use the fetch polyfill   let url    https   example com    fetch url   then res   gt  res json     then  out    gt      console log  Checkout this JSON     out       catch err   gt    throw err       MDN  Fetch API  Even though Node js does not have this method built-in  you can use node-fetch which allows for the exact same implementation

User · Answer

this morning  i also had the same doubt and now its cleared  i had just used JSON with  open-weather-map  https   openweathermap org   api and got data from the URL in the index html file  the code looks like this -   x000D   x000D     got location x000D   var x   document getElementById  demo    x000D        if  navigator geolocation    x000D          navigator geolocation getCurrentPosition weatherdata   x000D          else    x000D          x innerHTML    Geolocation is not supported by this browser    x000D          x000D        fetch openweather map url with api key x000D      function weatherdata position    x000D    put corrdinates to get weather data of that location x000D        fetch  https   api openweathermap org data 2 5 weather lat   position coords latitude   amp lon   position coords longitude   amp appid b2c336bb5abf01acc0bbb8947211fbc6   x000D         then response   gt  response json    x000D         then data   gt    x000D        console log data   x000D        document getElementById  demo   innerHTML    x000D          lt br gt wind speed -  data wind speed    x000D          lt br gt humidity  -  data main humidity    x000D          lt br gt temprature  -  data main temp   x000D            x000D        x000D     lt div id  demo  gt  lt  div gt  x000D   x000D   x000D    i had give api key openly because i had free subscription  just have a free subscriptions in beginning  you can find some good free api s and keys at  rapidapi com

User · Answer

Define a function like   fetchRestaurants callback        fetch  http   www restaurants com           then response   gt  response json            then json   gt  callback null  json restaurants           catch error   gt  callback error  null       Then use it like this   fetchRestaurants  error  restaurants    gt        if  error           console log error      else          console log restaurants 0

User · Answer

Resolved const fetchPromise1   fetch url       fetchPromise1 then response   gt          console log response               Pending const fetchPromise   fetch url   console log fetchPromise

User · Answer

You can use jQuery  getJSON   function     getJSON  http   query yahooapis com v1 public yql q select 20 2a 20from 20yahoo finance quotes 20WHERE 20symbol 3D 27WRC 27 amp format json amp diagnostics true amp env store   datatables org alltableswithkeys amp callback   function data           JSON result in  data  variable       If you don t want to use jQuery you should look at this answer for pure JS solution  https   stackoverflow com a 2499647 1361042

User · Answer

If you want to do it in plain javascript  you can define a function like this   var getJSON   function url  callback        var xhr   new XMLHttpRequest        xhr open  GET   url  true       xhr responseType    json       xhr onload   function           var status   xhr status        if  status     200            callback null  xhr response           else           callback status  xhr response                      xhr send         And use it like this   getJSON  http   query yahooapis com v1 public yql q select 20 2a 20from 20yahoo finance quotes 20WHERE 20symbol 3D 27WRC 27 amp format json amp diagnostics true amp env store   datatables org alltableswithkeys amp callback   function err  data      if  err     null        alert  Something went wrong      err       else       alert  Your query count      data query count             Note that data is an object  so you can access its attributes without having to parse it

User · Answer

You can access JSON data by using fetch   in JavaScript  Update url parameter of fetch   with your url   fetch url       then function response           return response json                then function data           console log data            Hope It helps  it worked perfectly for me

User · Answer

ES8 2017  try  obj   await  await fetch url   json       x000D   x000D  async function load     x000D      let url    https   my-json-server typicode com typicode demo db   x000D      let obj   await  await fetch url   json    x000D      console log obj   x000D    x000D   x000D  load    x000D   x000D   x000D    you can handle errors by try-catch   x000D   x000D  async function load     x000D      let url    http   query yahooapis com v1 publ      x000D      let obj   null  x000D       x000D      try   x000D          obj   await  await fetch url   json    x000D        catch e    x000D          console log  error    x000D        x000D       x000D      console log obj   x000D    x000D   x000D  load    x000D   x000D   x000D

User · Answer

x000D   x000D  async function fetchDataAsync     x000D      const response   await fetch  paste URL    x000D      console log await response json    x000D   x000D    x000D   x000D   x000D  fetchDataAsync    x000D   x000D   x000D

User · Answer

Axios is a promise based HTTP client for the browser and node js   It offers automatic transforms for JSON data and it s the official recommendation from the Vue js team when migrating from the 1 0 version which included a REST client by default      Performing a GET request     Make a request for a user with a given ID axios get  http   query yahooapis com v1 publ         then function  response        console log response           catch function  error        console log error            Or even just axios url  is enough as a GET request is the default

[javascript] How to get JSON from URL in JavaScript?

Examples related to javascript

Examples related to json