JSONP Callback is undefined

Question

Я NOOB, и я вижу, что другие пользователи столкнулись с подобной проблемой, но после многих часов разочарования я не могу заставить функцию обратного вызова JSONP работать.

Я пытаюсь извлечь «woeid» информацию из Yahoo geo.places, поэтому я могу использовать ее, чтобы указать местоположение для получения данных о погоде. Я получаю ввод (например, почтовый индекс) из идентификатора «location» в форме и отправляю его в Yahoo.

Код возвращает объект XMLHttpRequest, который я могу прочитать, посмотрев на xhr.responseText в консоли, но я не могу извлечь объект JSON, который передается на функцию обратного вызова сервером.

Я знаю, что должен сделать простую ошибку, однако я не могу понять, что это такое. Я пытаюсь сделать это через Javascript, прежде чем научиться извлекать данные с помощью метода $ .ajax в jQuery.

Можете ли вы сказать мне, где ошибка? Вот мой код:

// an XMLTHttpRequest 
var xhr = null; 

/* 
* void 
* getWoeid() 
* gets WOEID from Yahoo geo.places to use in request 
* for weather data 
* 
*/ 



function getWoeid() { 
// instantiate XMLHttpRequest object 
try { 
    xhr = new XMLHttpRequest(); 
} 
catch (e) { 
    xhr = new ActiveXObject("Microsoft.XMLHTTP"); 
} 

// handle old browsers 
if (xhr == null) { 
    alert("Ajax not supported by your browser!"); 
    return; 
} 

// construct URL 
var userinput = document.getElementById("location").value; 

var data = encodeURIComponent("select * from" + 
      " geo.places where text =" + userinput); 

var url = "http://query.yahooapis.com/v1/public/yql?q=" + data + "&format=json& callback=callback"; 


// get data 
xhr.onreadystatechange = handler; 
xhr.open("GET", url, true); 
xhr.send(null); 
} 


// callback function 
function callback(response) { 
    woeid = response; 
} 


/* 
* void 
* handler() 
* 
* Handles the Ajax response 
*/ 

function handler() { 

// only handle loaded requests 
if (xhr.readyState == 4) { 

    // display response if possible 
    if (xhr.status == 200) { 
      var location = woeid; 
    } 

    else  
     alert("Error with Ajax call"); 
} 

}

Answer 1

Вы не можете использовать объект XHR запросить результат JSONP, из-за same origin policy. Кроме того, даже если вы сделаете запрос локально, использование объекта XHR для запроса будет означать, что функция callback не будет вызываться, вы просто получите код для вызова этого ответа.

Чтобы сделать запрос на JSONP, вы используете тег сценария:

var script = document.createElement('script'); 
script.src = url; 
document.head.appendChild(script);