Richiesta API esterna GET() utilizzando jQuery

Sto utilizzando lo IMDb API v2.0 che si trova qui e ho deciso di testarlo. Non posso Penso che sia la richiesta cross-browser AJAX da siti esterni ... ma non conosco altro modo. Ad esempio, ecco un test allo imdbapi avatar Richiesta API esterna GET() utilizzando jQuery

Vedere? Ecco il mio codice.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 

<head> 
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 


    <title>IMDB api</title> 

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> 

    <script type="text/javascript"> 
    $(document).ready(function() 
{ 
    $('#movie').keyup(function() { 

     var yourMovie = $("#movie").val(); 
    $("#debug").append("You are searching for ... "+yourMovie+"\n"); 

dataString = "t=Avatar"; 

$.ajax({ 
type: "GET", 
url: "http://www.imdbapi.com/", 
cache: false, 
data: dataString, 

success: function(html){ 
//$("#more").after(html); 
alert("Success!"); 
} 

}); 
}); 
}); 
</script> 

</head> 
<body> 


<form action="#" method="get" enctype="text/html" > 
<input type="text" id="movie" maxlength="50" /> 

</form> 

<div id="other"> 
    Trigger the handler 
</div> 
<br /> 
<textarea id="debug" style="width: 500px;height:150px;border:1px solid black;font-face:typewriter;"></textarea><br /> 
<textarea id="more" style="width: 500px;height:150px;border:1px solid red;font-face:typewriter;"></textarea> 

</body> 
</html>

Sto usando Google Chrome.

Ecco cosa ha funzionato per me:

<script type="text/javascript"> 
    $(document).ready(function() 
{ 
    $('#movie').keyup(function() { 

     var yourMovie = $("#movie").val(); 
    $("#debug").append("You are searching for ... "+yourMovie+"\n"); 

dataString = "callback=?&t=Avatar"; 

$.getJSON('http://www.imdbapi.com/', dataString, function(html){ 
//$("#more").after(html); 
alert("Success!"); 
}); 


}); 
}); 
</script>

fonte

2012-04-02 nn2

Sostituire:

$.ajax({ 
type: "GET", 
url: "http://www.imdbapi.com/", 
cache: false, 
data: dataString, 

success: function(html){ 
//$("#more").after(html); 
alert("Success!"); 
} 
});

Con

$.getJSON('http://www.imdbapi.com/?' + dataString, function(json_data){ 
alert(JSON.stringify(json_data)); 
});

fonte

2012-04-02 22:44:52 iambriansreed

non funzionerà, è cross domain –

Aha, ho capito ora. Grazie. Sapevo che stavo usando quello sbagliato. – nn2

@Topener getJSON funziona x-domain. [RTFM] (http://api.jquery.com/jQuery.getJSON/). – iambriansreed

È possibile eseguire croce dominio Ajax con jQuery. Impostare l'opzione crossDomain sul sito chiamata:

http://api.jquery.com/jQuery.ajax/

crossdomain (aggiunto 1.5) booleano predefinito: false per le richieste dello stesso dominio, vero per le richieste tra domini Se si desidera forzare un crossdomain richiesta (come ad esempio JSONP) sullo stesso dominio, impostare il valore di crossdomain true

Modifica-

01.235.164,106174 millions

In realtà, qual è esattamente il tuo problema? Ho provato questo e restituisce Json correttamente. esempio

http://jsfiddle.net/7VcUJ/

Risposta:

HTTP/1.1 200 OK Cache-Control: no-cache Pragma: no-cache Content-Type: text/html; charset = utf-8 Scade: -1 Server: Microsoft-IIS/7.0 Versione X-AspNet: 4.0.30319 X-Powered-By: ASP.NET Data: Lun, 02 Apr 2012 22:28:14 Contenuto GMT -Lunghezza: 618

{"Titolo": "Avatar", "Anno": "2009", "Valutato": "PG-13", "Rilasciato": "18 dic 2009", "Genere": "Azione, Avventura, Fantasia, Fantascienza", "Regista": "James Cameron", "Scrittore": "James Cameron", "Attori": "Sam Worthington, Zoe Saldana, Sigourney Weaver, Michelle Rodriguez", "Plot": "Un paraplegico marine spedito sulla Luna Pandora su una missione unica diventa strappato tra seguire i suoi ordini e proteggere il mondo che sente è la sua casa .", "Poster": "http://ia.media -imdb.com/images/M/MV5 BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw @@ ._ V1_SX320.jpg "," Runtime ":" 2 ore 42 min "," Classificazione ":" 8.1 "," Voti ":" 386930 "," ID ":" tt0499549 "," Risposta ": "True"}

fonte

2012-04-02 22:26:26 asawyer

Hmmm, ancora non funziona per me. L'ho chiamato con un tipo indefinito: i.imgur.com/yWaF6.png – nn2

È una chiamata AJAX interdominio, quindi è necessario un callback. jQuery rende tutto molto semplice, basta aggiungere ?callback=? al tuo indirizzo.

url: "http://www.imdbapi.com/?" + dataString + "&callback=?"

Salta il data = dataString in questo caso, rende più facile (ho trovato).

Prova questa, e continuare su ulteriormente:

$.getJSON("http://www.imdbapi.com/?" + dataString + "&callback=?").success(function(data){ 
    console.log(data); // will contain all data (and display it in console) 
})

Questa è la stessa:

$.ajax({ 
type: "GET", 
url: "http://www.imdbapi.com/?"+dataString+"&callback=?", 
dataType: 'JSONP' 
success: function(data){ 
    console.log(data); 
}

fonte

2012-04-02 22:28:11

Hmmm, non funziona ancora per me. L'ho richiamato con un tipo indefinito: http://i.imgur.com/yWaF6.png – nn2

aggiunto ulteriori informazioni alla mia risposta –

aggiungere un parametro callback per l'URL da utilizzare JSONP: