使用jQuery的外部API GET(）请求

External API GET() request using jQuery

本文关键字：请求 GET API jQuery 外部 使用      更新时间：2023-09-26

我正在使用这里的IMDb API v2.0，我决定测试它。我不能。我认为这是因为来自外部网站的跨浏览器AJAX请求。。但我不知道其他办法。例如，这里有一个在imdbapi化身上的测试

看到了吗？这是我的密码。

<!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>

我正在使用谷歌浏览器。

以下是对我有效的方法：

    <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>

替换：

$.ajax({
type: "GET",
url: "http://www.imdbapi.com/",
cache: false,
data: dataString,
success: function(html){
//$("#more").after(html);
alert("Success!");
}
});

带

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

这是一个跨域AJAX调用，因此需要回调。jQuery让这变得非常简单，只需将?callback=?添加到您的url即可。

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

在这种情况下跳过data = dataString，会更容易（我发现）。

试试这个，然后继续：

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

这与相同

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

您可以使用jQuery运行跨域Ajax。在呼叫站点设置crossDomain选项：

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

crossDomain（添加了1.5）布尔值默认值：对于相同的域请求为false，true适用于跨域请求如果您希望强制跨域请求（如JSONP），设置的值跨域到真正的

编辑-

事实上，你到底有什么问题？我试过了，它正确地返回Json。

http://jsfiddle.net/7VcUJ/

响应示例：

HTTP/1.1 200 OK缓存控制：无缓存Pragma：无缓存内容类型：text/html；charset=utf-8过期时间：-1服务器：Microsoft IIS/7.0X-AspNet-版本：4.0.30319 X-Powered-Bor:ASP.NET日期：4月2日星期一2012 22:28:14 GMT内容长度：618

{"标题"："阿凡达"，"年份"："2009"，"分级"："PG-13"，"发布"："12月18日2009年"，"流派"："动作，冒险，幻想，科幻"，"导演"："詹姆斯卡梅隆"，"作家"："詹姆斯·卡梅隆"，《演员》："山姆·沃辛顿，佐伊Saldana，Sigourney Weaver，Michelle Rodriguez"，"情节"："截瘫被派往月球执行独特任务的海军陆战队队员潘多拉被撕裂在服从他的命令和保护他认为属于他的世界之间家"，"海报"："http://ia.media-imdb.com/images/M/MV5BMTYwOTEwNjAzMl5BMl5BanBnXkFtZTcwODc5MTUwMw@@_V1_SX320.jpg"，"运行时"："2小时42分钟"，"评分"："8.1"，"投票数"："386930"，"ID"："tt0499549"，"响应"："真"}

将callback参数添加到URL以使用JSONP:

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

使用$将使jQuery自动为您生成回调函数并自动处理响应。

推荐阅读：JSONP是关于什么的？

相关文章：