Maison  >  Article  >  interface Web  >  Comment extraire des données JSON d'une URL à l'aide de JavaScript ?

Comment extraire des données JSON d'une URL à l'aide de JavaScript ?

Susan Sarandon
Susan Sarandonoriginal
2024-10-27 20:46:30420parcourir

How to Extract JSON Data from a URL Using JavaScript?

Récupération de données JSON à partir d'une URL à l'aide de JavaScript

Cet article aborde le problème de l'extraction de données JSON à partir d'une URL spécifique. L'URL fournie renvoie JSON au format suivant :

<code class="json">{
  query: {
    count: 1,
    created: "2015-12-09T17:12:09Z",
    lang: "en-US",
    diagnostics: {},
    ...
  }
}</code>

Les tentatives d'accès à l'objet JSON à l'aide du code suivant ont échoué :

<code class="js">responseObj = readJsonFromUrl('http://query.yahooapis.com/v1/publ...');
var count = responseObj.query.count;

console.log(count) // should be 1</code>

Solution :

Pour obtenir un objet JavaScript à partir de la réponse JSON de l'URL, on peut utiliser la fonction .getJSON() de jQuery :

<code class="js">$.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
});</code>

Alternativement, pour une solution JavaScript pure, considérez la réponse suivante :

<code class="js">// Create a new XMLHttpRequest object
var xhr = new XMLHttpRequest();

// Open a GET request to the specified URL
xhr.open('GET', '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', true);

// Set the response type to JSON
xhr.responseType = 'json';

// Send the request
xhr.send();

// Handle the response
xhr.onload = function() {
    if (xhr.status === 200) {
        // The request was successful
        var data = xhr.response;

        // Access the JSON data as needed
        console.log(data.query.count);
    } else {
        // The request failed
        console.log('Error: ' + xhr.status);
    }
};</code>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn