Как я могу заставить jsonp хорошо играть со своим классом? - PullRequest
2 голосов
/ 30 мая 2010

Вся эта штука с jsonp довольно запутанная ...

Вот что я хочу сделать:

  • У меня есть класс DataRetriever
  • В классе есть метод GetData
  • GetData делает запрос jsonp со следующим кодом:

    var new_tag = document.createElement('script');
    new_tag.type = 'text/javascript';
    new_tag.src = 'http://somesite.com/somemethod?somedata';
    // Add the element
    var bodyRef = document.getElementsByTagName("body").item(0);
    bodyRef.appendChild(new_tag);
    

Теперь данные jsonp с сервера somesite.com могут вызывать функцию в моем коде с данными. Проблема в том, как данные доставляются в экземпляр DataRetriever, который их запросил?

Я действительно застрял здесь.

1 Ответ

4 голосов
/ 30 мая 2010

Решение, которое придумало jQuery, заключается в предоставлении функции анонимного обратного вызова, подобной этой:

jQuery.getJSON("http://mycrossdomain.com/?callback=?", function(data) {
   // Now I have the data
});

Думаю, это можно адаптировать и к вашему делу.

var data = new DataRetriever();
data.GetData(function(data) {
    // Now I have the data 
});

Вы можете сделать то же самое за кадром в функции GetData, если вы не хотите предоставлять анонимную функцию.

function GetData(callback) { // optional
    // Create random function name however you want
    var funcName = "data_" + (+new Date() + Math.floor(Math.random()*100)),
        // Moved this up to be available in the random function
        new_tag = document.createElement('script');
    // This part will allow you to do the callback behind the scenes if callback isn't provided as a param
    callback = callback || function(data) {
        this.dataReturned = data; // or something
    }
    // Assign it to the window object
    window[funcName] = function(data) {
         callback(data);
         // Unassign this function
         delete window[funcName];
         // Recycle the script tag
         document.body.removeChild(new_tag);
    }
    new_tag.type = 'text/javascript';
    new_tag.src = 'http://somesite.com/somemethod?callback='+funcName;
    // Add the element
    document.body.appendChild(new_tag);
 }

Обратите внимание, вам нужно убедиться, что JSONP-запрос принимает параметр GET обратного вызова. Если вы используете сторонние API, они уже будут поддерживать это. Надеюсь, это поможет!

...