1
votes

Faire une requête json avec javascript

Je crée une application Web qui utilise une API. Le problème est que je n'ai jamais fait de requêtes JSON avec javascript (j'avais l'habitude de travailler avec python). Voici mon code:

{
    "ip": "8.8.8.8",
    "city": "Mountain View",
    "region": "California",
    "region_code": "CA",
    "country": "US",
    "country_code": "US",
    "country_code_iso3": "USA",
    "country_capital": "Washington",
    "country_tld": ".us",
    "country_name": "United States",
    "continent_code": "NA",
    "in_eu": false,
    "postal": "Sign up to access",
    "latitude": "Sign up to access",
    "longitude": "Sign up to access",
    "timezone": "America/Los_Angeles",
    "utc_offset": "-0700",
    "country_calling_code": "+1",
    "currency": "USD",
    "currency_name": "Dollar",
    "languages": "en-US,es-US,haw,fr",
    "country_area": 9629091.0,
    "country_population": 310232863.0,
    "message": "Please message us at ipapi.co/trial for full access",
    "asn": "AS15169",
    "org": "GOOGLE"
}

Voici le fichier JSON:

<head>
  <title>IP finder pro</title>
  <script>
    function find_ip() {
      var ip = document.getElementById('ip_input').value;
      fetch('http://ipapi.co/8.8.8.8/json')
      .then(response => response.json())
      .then(data => alert(data));
}
  </script>
</head>
<body>
  <input id="ip_input">
  <button id="ip_button" onclick="find_ip()">Click !</button>
</body>

Et voici la commande curl:

curl 'https://ipapi.co/8.8.8.8/json/'

Avez-vous une idée de comment je pourrais faire cela?

javascript json api python-requests

0 commentaires

3 Réponses :

2
votes

Vous pouvez utiliser l'API fetch pour cela et décoder votre JSON. https://developer.mozilla.org/en-US/ docs / Web / API / Fetch_API / Using_Fetch

fetch('http://example.com/movies.json')
  .then(response => response.json())
  .then(data => console.log(data));

3 commentaires

Je pense que fetch est la meilleure solution. Cependant, vous devez être conscient qu'il n'est pas pris en charge par tous les navigateurs ou par les anciennes versions de ceux-ci. Si vous par exemple besoin de prendre en charge IE merdique, il est probablement préférable d'utiliser une sorte de bibliothèque http-request.

Il me renvoie ceci: [object Object] .

mhh .. C'est bizarre. Pouvez-vous fournir votre mise en œuvre de cet exemple?

1
votes

Vous pouvez également utiliser Ajax.

function ajax_get(url, callback) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        console.log('responseText:' + xmlhttp.responseText);
        try {
            var data = JSON.parse(xmlhttp.responseText);
        } catch(err) {
            console.log(err.message + " in " + xmlhttp.responseText);
            return;
        }
        callback(data);
    }
};

xmlhttp.open("GET", url, true);
xmlhttp.send();
}


ajax_get('your url', function(data) {
  // Do stuff with it -> data["yourvalue"];
});

0 commentaires

1
votes

Essayez cette solution

var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            var Obj = JSON.parse(this.responseText);
            console.log(Obj);
           }
        };
    xmlhttp.open("GET", "your_json_file.json", true);
    xmlhttp.send();

0 commentaires