JSON

2016-07-06 1 views
1

모두를 사용하여 개방형 날씨지도 API에서 한 항목의 데이터를 가져올 수 없습니다.JSON

이것은 Open Weather Map API에 연결하여 성공적으로 데이터 항목을 표시 할 수 있는지 확인하기위한 테스트입니다 (지금은 주어진 위도와 경도에 대한 도시 이름을 얻으려고합니다).

나는 이것을 CodePen 펜 안에 넣고 있습니다.

문제는 페이지에 아무것도 표시되지 않는다는 것입니다. 도시 이름이 전혀 없습니다.

이것은 무엇입니까?

<html><body> 
<div class="Text-center"> 
     <h1> Local Weather</h1> 
     <h3>Front End Dev Project</h3> 
    <ul class ="list-unstyled"> 
     <li class="btn btn-default" id="city"></li> 
    </ul> 
<div> 
</body></html> 


<script> 
$(document).ready(function(){ 

    var long= -77.0506895; 
    var lat = 38.8925157; 
    var api = 'http://api.openweathermap.org/data/2.5/weatherlat='+lat+'&lon'+long+'=&appid=(HIDDEN)'; 

    $.getJSON(api, function(data){ 
     var city = data.name; 
     $("#city").html(city); 
    }); 

}); 

</script> 

답변

0

이 올바른 URL입니다 , 당신의 URL을 수정하시기 바랍니다 (내 API 키를 가려 한)

http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid= {AppKey}

{ 
    "coord":{ 
     "lon":138.93, 
     "lat":34.97 
    }, 
    "weather":[ 
     { 
     "id":800, 
     "main":"Clear", 
     "description":"clear sky", 
     "icon":"01n" 
     } 
    ], 
    "base":"cmc stations", 
    "main":{ 
     "temp":297.374, 
     "pressure":1018.36, 
     "humidity":93, 
     "temp_min":297.374, 
     "temp_max":297.374, 
     "sea_level":1027.9, 
     "grnd_level":1018.36 
    }, 
    "wind":{ 
     "speed":7.46, 
     "deg":243.504 
    }, 
    "clouds":{ 
     "all":0 
    }, 
    "dt":1467816873, 
    "sys":{ 
     "message":0.0045, 
     "country":"JP", 
     "sunrise":1467747404, 
     "sunset":1467799281 
    }, 
    "id":1851632, 
    "name":"Shuzenji", 
    "cod":200 
} 
+0

감사합니다. 나는 당신이 나의 열쇠를 삽입했다는 것을 제외하고는 당신이 진술 한 것과 정확히 일치하는 URL을 바꾸었다. 그러나 도시의 이름 ("Shuzenji")은 여전히 ​​페이지에 나타나지 않습니다. –

0

OK 아래의 반응, 다음은 CodePen의 외부에서 작동합니다. CodePen에서 사용하면 JSON 호출을 차단하고 있습니다. Chrome에서 NotePad로 작성된 버전에서이 코드를 실행하면 "Shuzenji"가 올바르게 반환됩니다.

하지만 다른 스레드의 문제입니다.

<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" ></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    var api = 'http://api.openweathermap.org/data/2.5/weather?lat=35&lon=139&appid=52481ca8a499564783f5f082863acac1'; 
    $.getJSON(api, function(data){ 
     var city = data.name; 
     $("#city").html(city); 
    }); 
}); 
</script> 
</head> 
<body> 
<div class="Text-center"> 
     <h1> Local Weather</h1> 
     <h3>Front End Dev Project</h3> 
    <ul class ="list-unstyled"> 
     <li class="btn btn-default" id="city"></li> 
    </ul> 
<div> 
</body> 
</html>