2016-05-08 2 views
2

Я пытаюсь сделать страницу, которая будет использовать openweathermap api для отображения города пользователя и локальной температуры, к сожалению, похоже, что он не обрабатывает JSON api и не является ничего не делать. Мой код в порядке, насколько я могу судить, поэтому я не понимаю, что случилось.
Вот jsfiddle ссылку и javscript код:
https://jsfiddle.net/qo2h1L9e/2/Javascript не обрабатывает JSON api

$(document).ready(function() { 
    var data; 
    if (navigator.geolocation) { 
    navigator.geolocation.getCurrentPosition(function(position) { 
     var lat = position.coords.latitude; 
     var lon = position.coords.longitude; 
     console.log(lat); 
     console.log(lon); 
     console.log("api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&APPID=4907e373098f091c293b36b92d8f0886"); 
     $.getJSON("api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&APPID=4907e373098f091c293b36b92d8f0886", function(json) { 
     data = json; 
     console.log(data.name); 
     $("#city").text(data.name); 
     }); 
    }); 
    } 
}); 
+0

Адреса предполагаются относительно текущего 'window.location', а' api.openweathermap.org' также может быть допустимым именем каталога. Включите протокол и '//' привязать в адресе, чтобы он распознавался как имя хоста - '' http: //api.openweathermap.org/... "' –

+0

Я сделал, как вы рекомендовали, и это не помогло. Когда я беру URL-адрес с консоли и помещаю его в адресную строку в своей поисковой системе, я получаю желаемый объект JSON на своей странице, но мой код, похоже, не получает его по какой-то причине. – majestyc54

+0

Получаете ли вы какие-либо ошибки? Браузеры обычно регистрируют причины сбоев Ajax-запросов в своих консолях. –

ответ

1

У меня была аналогичная проблема при кодировании этого. Предполагая, что вы на FCC?

Anyways, попробуйте добавить & callback =? к URL-адресу api. Возможно, вам придется получить данные как JSONP, а не JSON.

Кроме того, вам не нужно определять данные. Вы можете получить доступ к объекту непосредственно через параметр json.

0

Я сделал это JQuery попробовать этот код

 $(document).ready(function() { 
      var data; 
      if (navigator.geolocation) { 
       navigator.geolocation.getCurrentPosition(function(position) { 
        var lat = position.coords.latitude; 
        var lon = position.coords.longitude; 
        console.log(lat); 
        console.log(lon); 
        console.log("api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&APPID=4907e373098f091c293b36b92d8f0886"); 
//     $.getJSON("api.openweathermap.org/data/2.5/weather?lat=" + lat + "&lon=" + lon + "&APPID=4907e373098f091c293b36b92d8f0886", function(json) { 
//      data = json; 
//      console.log(data.name); 
//      $("#city").text(data.name); 
        //     }); 
        var url = 'http://api.openweathermap.org/data/2.5/weather'; 
        var params = {}; 
        params.lat = lat; 
        params.lon = lon; 
        params.APPID = "4907e373098f091c293b36b92d8f0886"; 

        $.ajax({ 
         type: "GET", 
         url: url, 
         dataType: "jsonp", 
         contentType: "application/json; charset=utf-8", 
         data: params, 
         success: function (res) { 
          console.log(res); 
         }, 
         error: function (res) { 
         } 
        }); 


       } 
       ); 
      } 
     }); 

Проблема в json .Для использования перекрестного домена jsonp.

Смежные вопросы