2011-01-12 15 views
5

Non dovrebbe seguire la richiesta AJAX con lavoro JQuery?Come interrogare l'API grafico di Facebook con JSONP

$.getJSON('https://graph.facebook.com/138654562862101/feed?callback=onLoadJSONP'); 

Ho definito una funzione di callback denominata onLoadJSONP.

Ma Chrome mi dà un tipico errore di same-origin-politica:

XMLHttpRequest cannot load https://graph.facebook.com/138654562862101/feed?callback=onLoadJSONP . Origin null is not allowed by Access-Control-Allow-Origin.

ho pensato JSONP lavorato intorno a quella, che cosa sto facendo male?

risposta

17

jQuery detects JSONP desired behaviorspecificamente con callback=?, quindi avrai bisogno di esattamente che, quindi passa la funzione che si desidera gestire la cosa. Senza modifiche al di fuori, si potrebbe fare questo:

$.getJSON('https://graph.facebook.com/138654562862101/feed?callback=?', onLoadJSONP); 

Questo permette la ricerca di callback=? a lavorare ancora utilizzando la funzione di callback direttamente. In precedenza, non rilevava che si desiderava un recupero JSONP e stava tentando di utilizzare un XMLHttpRequest per acquisire i dati ... che non riesce a causa della stessa restrizione dei criteri di origine.

+0

Questo funziona anche in IE? (Funziona per Chrome e Firefox per me, ma fallisce in IE). Grazie. – user1055761

+0

Che errore stai ottenendo in IE? –

+0

mi dà errore 'nessun trasporto', quando eseguo il debug tramite il debugger di IE. Hai questo lavoro su IE? Grazie ! – user1055761

4

Deve essere "callback =?" e quindi si definisce il callback come ultimo parametro della richiesta.

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", 
    { 
    tags: "cat", 
    tagmode: "any", 
    format: "json" 
    }, 
    function(data) { 
    $.each(data.items, function(i,item){ 
     $("<img/>").attr("src", item.media.m).appendTo("#images"); 
     if (i == 3) return false; 
    }); 
    }); 
1

semplice add seguente codice JavaScript prima di effettuare qualsiasi cross-domain AJAX chiamata.

jQuery.support.cors = true; 

$.ajaxTransport("+*", function(options, originalOptions, jqXHR) { 

    if(jQuery.browser.msie && window.XDomainRequest) { 

    var xdr; 

    return { 

     send: function(headers, completeCallback) { 

      // Use Microsoft XDR 
      xdr = new XDomainRequest(); 

      xdr.open("get", options.url); 

      xdr.onload = function() { 

       if(this.contentType.match(/\/xml/)){ 

        var dom = new ActiveXObject("Microsoft.XMLDOM"); 
        dom.async = false; 
        dom.loadXML(this.responseText); 
        completeCallback(200, "success", [dom]); 

       }else{ 

        completeCallback(200, "success", [this.responseText]); 

       } 

      }; 

      xdr.ontimeout = function(){ 
       completeCallback(408, "error", ["The request timed out."]); 
      }; 

      xdr.onerror = function(){ 
       completeCallback(404, "error", ["The requested resource could not be found."]); 
      }; 

      xdr.send(); 
     }, 
     abort: function() { 
      if(xdr)xdr.abort(); 
     } 
    }; 
    } 
}); 
Problemi correlati