4

今天我在阅读Coursera 目录文档后尝试使用 jquery 访问 coursera api 。写了一段代码，报错了No 'Access-Control-Allow-Origin' header is present on the requested resource.于是google了一些，发现可以使用Jsonp进行跨域请求。所以我只是使用 $.ajax 函数向这个url发出请求，或者说这个简单的 url和其他一些这样的 url，但失败了。

网址上的数据就像{"elements":[{"id":2,"shortName":"ml","name":"Machine Learning","links":{}}],"linked":{}}

我写了以下代码。

$(document).ready(function() {
$.ajax({
    url: "https://api.coursera.org/api/catalog.v1/courses/2",
    type: "GET",
    dataType: 'jsonp',
    jsonpCallback: 'localJsonpCallback',
    contentType: 'application/json',
    success: function(){
        alert("success");
    },
    error:function(jqxhr, textStatus, error){
        alert("textStatus : " + textStatus + "\n error" + error);
    }   
  }); 

  function localJsonpCallback(data) {
  alert("localJsonpCallback : " + data);
  }
  });

上面的代码失败并转到错误处理程序，它的打印错误是 ,textstatus: parseError和Error: localJsonpCallback was not called。我没有得到代码有什么问题。此外，在控制台中我收到错误Uncaught SyntaxError: Unexpected token : ，并且2?callback=localJsonpCallback&_=1418037208234:1在使用 url https://api.coursera.org/api/catalog.v1/courses/2时。

有必要使用jsonp回调函数吗？我们不能在成功处理程序中处理直接响应吗？

4

3 回答 3

3

这行得通

你可以直接在success回调中处理

$(document).ready(function() {
  $.ajax({
    url: "https://api.coursera.org/api/catalog.v1/courses/2",
    type: 'GET',
    dataType: "json",
    success: function(data) {
        console.log(JSON.stringify(data,null,4));
    }
  }); 
});

回来

 {
    "elements": [
        {
            "id": 2,
            "shortName": "ml",
            "name": "Machine Learning",
            "links": {}
        }
    ],
    "linked": {}
}

希望这可以帮助

于 2014-12-08T12:14:37.840 回答
2

试试这个：-

$(document).ready(function() {    
$.getJSON("https://api.coursera.org/api/catalog.v1/courses?ids=2,3&fields=language,shortDescription&includes=sessions&fields=status&categories", function (response) {
alert(JSON.stringify(response));
},'jsonp'); 
 });

演示

于 2014-12-08T11:49:03.680 回答
2

在我们的例子中你不需要使用 jsonp，你可以使用通常的 ajax 请求

$.ajax({
    url: "https://api.coursera.org/api/catalog.v1/courses/2",
    type: "GET",
    dataType: 'json',
    success: function (res) {
      console.log(res);
    },
    error: function(jqxhr, textStatus, error) {
        alert("textStatus : " + textStatus + "\n error" + error);
    }
});

演示： http: //jsbin.com/payare/1/edit ?js,console

于 2014-12-08T11:51:05.250 回答