2013-06-09 3 views
1

을 사용하여 학교 프로젝트를위한 날씨 웹 사이트를 만들고 있습니다. 이것은 내가 JSON 데이터를 얻기 위해 사용하고있는 코드입니다 : 내 API 키를 어디에 두오프라인에서 온라인 JSON 파일에 어떻게 액세스합니까? (자바 스크립트)

$.getJSON("http://api.wunderground.com/api/<apikey>/conditions/q/" + wlocation + ".json", function(data){ 
    alert(data); 
}); 

<apikey>이, 그리고 $ 문자 JQuery와 단지 바로 가기입니다. 내가 게시되지, 로컬이 웹 페이지를 열 때

, 아무런 경고가 튀어 올라 내가 오류 얻을 :이 오류에 대한 몇 가지 연구를하고 후

XMLHttpRequest cannot load http://api.wunderground.com/api/<apikey>/conditions/q/<myzipcode>.json. Origin null is not allowed by Access-Control-Allow-Origin. 

를, 내가 만들어야 할 수도 있습니다 같은데 웹 서버. 그러나 프로젝트의 경우 .html 및 다른 "웹 파일"의 폴더로 변환해야합니다. 이 작업을 수행하는 또 다른 방법이 있습니까, 아니면 웹 서버를 만들어야합니까? 이 프로젝트는 곧 완료 될 예정이므로 어떤 도움도 받으실 수 있습니다!

답변

1

여기는 원래 게시물 (http://www.wunderground.com/weather/api/d/docs?d=resources/code-samples)에서 제공 한 링크의 코드 샘플입니다. JSONP를 사용합니다. 그렇습니다. @antyrat가 말했듯이, 그것은 CORS 문제입니다.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
<script> 
jQuery(document).ready(function($) { 
    $.ajax({ 
     url : "http://api.wunderground.com/api/Your_Key/geolookup/conditions/q/IA/Cedar_Rapids.json", 
     dataType : "jsonp", 
     success : function(parsed_json) { 
      var location = parsed_json['location']['city']; 
      var temp_f = parsed_json['current_observation']['temp_f']; 
      alert("Current temperature in " + location + " is: " + temp_f); 
     } 
    }); 
}); 
</script> 
+0

코드 샘플을 보내 주셔서 감사합니다! – nbura

3

예, 여기에 JSONP을 사용할 수 있습니다.

Wunderground Weather API에 JSON의 콜백 종류가 있는지 확실하지 않습니다. 하지만 그들은 심지어 jQuery를 할 경우 getJSON JSONP를 지원합니다.

Same origin policy처럼 실행됩니다.

+0

고맙습니다! JSONP에 대한 훌륭한 자습서를 알고 있습니까? – nbura

+0

@Nikola 음 ... 내가 제공 한 wiki 기사를 읽었습니까? 필요한 모든 코드가 있습니다. JSONP는 콜백 함수가있는 JSON이므로 튜토리얼과 같은 것이 없다고 생각합니다. – antyrat

+0

jQuery를 사용하고 있으므로 - 도움이 필요합니다. [.getJSON docs] (http://api.jquery.com/jQuery.getJSON/)에서 "JSONP URL에 문자열"callback =? "(또는 유사한, 서버 측 API에서 정의한대로)이 포함 된 경우), 요청은 대신 JSONP로 처리됩니다. 자세한 내용은 $ .ajax()의 jsonp 데이터 유형에 대한 설명을 참조하십시오. " – dc5

관련 문제