2012-03-27 5 views
1

저는 사용자가지도를 클릭 할 때 날씨 정보를 끌어 올 웹 호출을하는 작은 JavaScript 프로그램을 작성하고 있습니다. 이것은 내 코드입니다.XMLHttpRequest가 아무 것도 반환하지 않습니까?

//get the three letter airport code 
    var text = kmlEvent.featureData.name; 

    //service to get woeid 
    var woeid_url = 'http://where.yahooapis.com/geocode?name='; 
    xmlhttp = new XMLHttpRequest(); 
    //has to be sync, since next request depends on it 
    xmlhttp.open('POST', woeid_url + text, false); 
    xmlhttp.send(null); 
    //now we get the relevent info from the XML 
    xmlDoc = xmlhttp.responseXML; 
    woeid_xml = xmlDoc.getElementsByTagName('woeid'); 
    //parse the xml and get the woeid 
    woeid = woeid_xml[0].childNodes[0].nodeValue; 

    //with the woeid found, we can make the weather request 
    weatherhttp = new XMLHttpRequest(); 
    var weather_url = 'http://weather.yahooapis.com/forecastrss?w=' + woeid + '&u=f'; 
    //this is async 
    weatherhttp.open('POST', weather_url, true); 
    weatherhttp.onreadystatechange = function() { 
     if (weatherhttp.readyState == 4) { 
     alert(weatherhttp.status); 
     } 
    } 
    weatherhttp.send(null); 

사용자가 클릭하는 위치에 대해 Yahoo를 호출합니다. 이것은 효과가 있고 나는 괜찮아. 그러나 두 번째 호출을 기상 서비스로 만들면 아무 것도 반환하지 않고 0을 상태 코드로 반환합니다.

두 번째 부분을 비동기가 아닌 동기화로 변경하면 여전히 동일한 오류가 발생합니다. 누구든지 내가 뭘 잘못하고 있는지 알아? weather_url을 브라우저에 복사하면 잘로드됩니다. 나는 왜 첫 번째 부분이 작동하는지 이해하지 못하지만 두 번째 부분은 작동하지 않습니다. 저는 JavaScript와 AJAX에 익숙하지 않아서 제가하고있는 일을 전혀 알지 못합니다.

내가 사용하는 브라우저는 도움이된다면 FireFox입니다.

답변

1

JS를 처음 접했을 때부터 Prototype 또는 JQuery와 같은 프레임 워크를 사용하는 것이 좋습니다. 특히 AJAX와 관련하여 특히 그렇습니다. 그들은 모두 철저히 철분을 제거하고 당신을 위해 물건을 단순화합니다.

내 데이터가 부족한 이유는 요청이 다른 도메인의 데이터를로드하려고한다는 것입니다 (Same Origin Policy 참조). 이것이 실제로 문제가되는지 확인하기 위해 도메인 내에서 무언가를로드 테스트하십시오.

동기식 AJAX 통화에서 멀리 떨어져 있습니다! 일반적으로 콜백을 통해 데이터를 받으면 첫 번째 요청의 응답에 의존하는 작업을 수행하는 것이 가장 이상적입니다. 다시 말하지만, 이것은 프레임 워크를 통해 쉽게 달성 할 수있는 것입니다.

+1

'where.yahooapis.com'에 대한 첫 번째 호출은 다른 도메인에 있습니다. , 그리고 그것은 작동합니다. 그러나 'weather.yahooapis.com'은 그렇지 않습니다. 동일 출처 정책으로 인해 이러한 문제가 발생합니까? – TheEnigmaMachine

+0

프록시를 구축하여 요청을 처리하고이를 야후로 전달하는 페이지를 생성하여 동일 출처 정책을 완전히 해결할 수 있습니다. 'myserver.com/where.php? name = blah'는'http : //where.yahooapis.com/geocode? name = blah'에 대한 서버 측 요청을 만들어 결과를 호출자에게 반환합니다. – mellamokb

+1

방금 ​​jsfiddle에서 코드를 시도하고이 오류가 발생했습니다 :'XMLHttpRequest는 http://weather.yahooapis.com/forecastrss?w=12519826&u=f를로드 할 수 없습니다. Origin http://fiddle.jshell.net은 Access-Control-Allow-Origin에서 허용하지 않습니다. SOP 문제인 것으로 보입니다. 불그스릇에 던져지는 오류를 볼 수 있습니까? – dontGoPlastic

0

POST 대신 GET을 사용하십시오. the documentation 당 :

The PlaceFinder Web service supports only the HTTP GET method. Other HTTP methods are not supported.

수동 AJAX를 통해 생성 한 대 브라우저에서 만든 성공적으로 호출 사이에 차이가 있는지 확인하기 위해 Fiddler 같은 프록시 스니퍼를 사용하여 전화를 비교할 수 있습니다.

+0

GET을 사용하면 동일한 오류가 발생하지만 Fiddler를 살펴 보겠습니다. – TheEnigmaMachine

관련 문제