Saltar al contenido

¿Cómo obtener JSON de URL en JavaScript?

Deseamos mostrarte la mejor información que descubrimos por todo internet. Nosotros deseamos que te resulte de mucha ayuda y si quieres aportar alguna mejora puedes hacerlo..

Solución:

Puedes usar jQuery .getJSON() función:

$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys&callback', function(data) 
    // JSON result in `data` variable
);

Si no desea utilizar jQuery, debe consultar esta respuesta para obtener una solución JS pura: https://stackoverflow.com/a/2499647/1361042

Si desea hacerlo en javascript simple, puede definir una función como esta:

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();
;

Y utilízalo así:

getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys&callback',
function(err, data) 
  if (err !== null) 
    alert('Something went wrong: ' + err);
   else 
    alert('Your query count: ' + data.query.count);
  
);

Tenga en cuenta que data es un objeto, por lo que puede acceder a su attributes sin tener que analizarlo.

Con Chrome, Firefox, Safari, Edge y Webview, puede usar de forma nativa la API de búsqueda, lo que hace que esto sea mucho más fácil y mucho más conciso.

Si necesita soporte para IE o navegadores más antiguos, también puede usar el polyfill fetch.

let url = 'https://example.com';

fetch(url)
.then(res => res.json())
.then((out) => 
  console.log('Checkout this JSON! ', out);
)
.catch(err =>  throw err );

MDN: Obtener API

Aunque Node.js no tiene este método incorporado, puede usar node-fetch que permite exactamente la misma implementación.

Si para ti ha resultado útil nuestro post, sería de mucha ayuda si lo compartieras con otros desarrolladores así contrubuyes a dar difusión a nuestra información.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *