Отправка запроса json с javascript - PullRequest
Новая
       4

Отправка запроса json с javascript

1 голос
/ 17 июня 2020

Я делаю веб-приложение, использующее API. Проблема в том, что я никогда не делал JSON запросов с javascript (раньше работал с python). Вот мой код: 

<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>

Это файл JSON: 

{
    "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"
}

А это команда curl:

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

Ты хоть представляешь, как я мог это сделать?

Ответы [ 3 ]

2 голосов
/ 17 июня 2020

Вы можете использовать fetch API для этого и декодировать свой 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));
1 голос
/ 17 июня 2020

Попробуйте это решение 

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();
1 голос
/ 17 июня 2020

Вы также можете использовать 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"];
});
...