JSONP AJAX调用一个REST风格的API [英] JSONP ajax call to a restfull api

问题描述

我已经搜查了天，似乎没有人对此有明确的答案，我开始时如果想知道一台服务器/ API的问题，而不是一个Ajax之一。

I have searched for days and no one seems to have a definitive answer on this, i am begining to wonder if its a server/api issue and not an ajax one.

什么办法，我已经建立了使用Laravel 4.它死的简单没什么复杂的API。我已经包括以下

Any way i have built an API using Laravel 4. its dead simple nothing to complex. i have included the link below

我的问题API

基本上它返回以下

{"error":false,"question":[{"id":1,"question_title":"Question 1","question_answer_a":"question1_answer_a","question_answer_b":"question1_answer_b","question_answer_c":"question1_answer_c","question_answer_d":"question1_answer_d","question_correct_answers":"a,b,c","question_explination":"question1_explinaition","question_meta":"question1_metadata","created_at":"2013-03-20 13:03:38","updated_at":"2013-03-20 17:30:10","status":1,"question_id":1,"image_url":"42ac1edf76f16924780df90ce5621476f7a263f7.jpg"}]}

现在我是在本地工作，并在简单的HTML页面，我用这个AJAX调用来检索API数据

Now i am working locally and in a simple html page i am using this ajax call to retrieve the api data

$.ajax({ 
         type: "GET",
         dataType: "jsonp",
         contentType: "application/json",
         async: false,
         url: "http://wld-api.eu1.frbit.net/index.php/api/v1/question",
         success: function(data){        
            alert(data);
         }
     });

在Firefox萤火（Net标签）浏览器发出的号召，返回200 OK响应和我所有的JSON数据。我可以通过响应和JSON选项卡中单击和我所有的数据是存在的。

In Firefox firebug (NET tab) the browser makes the call, returns a 200 OK response and all my JSON data. i can click through the Response and JSON tab and all my data is there.

所以我的问题是......

So my question is....

为什么地狱不会成功，火，并提醒我的数据？如果我添加

WHY the hell doesn't success fire and alert my data? if i add

error: function(data){        
        alert(data);
     }

它警告，但Firefox和一切说，这是一个成功的？

it does alert but firefox and everything else says it was a success?

任何人都可以帮助我呢？

Can anyone assist me at all?

我刚才注意到萤火在控制台下的错误，它说

i have just noticed in firebug in the console under errors it says

    SyntaxError: invalid label   -   "error":false,"question":[{"id":3,"question_title":"Question

和指向错误的标签？这是停止成功fireing没有人知道的一个问题。

And points to the error label? is this an issue that stops success fireing does anyone know.

任何意见/解决方案将让我的一天

Any advice / solution would make my day

感谢山姆

推荐答案

为了使用JSONP，你要的告诉Laravel包裹JSON在回调函数：

In order to use JSONP, you have to tell Laravel to wrap the JSON in a callback function:

return Response::json( $data )->setCallback( Input::get('callback') );

接下来，你必须回调键添加到查询字符串：

Next, you have to add the callback key to the query string:

$.ajax({
     type: "GET",
     dataType: "jsonp",
     contentType: "application/json",
     async: false,
     url: "http://wld-api.eu1.frbit.net/index.php/api/v1/question?callback=?",
     success: function(data){        
        alert(data);
     }
});

---

注意：：您可以使用jQuery的 $。的getJSON（） 方法，而不是 $。阿贾克斯（）。它更简洁：

---

Note: you can use jQuery's $.getJSON() method instead of $.ajax(). It's much more succinct:

$.getJSON("....../api/v1/question?callback=?").done(function ( data ) {
    alert( data );
});

这篇关于JSONP AJAX调用一个REST风格的API的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！