4

今日、 Coursera カタログのドキュメントを読んだ後、jquery を使用して coursera api にアクセスしようとしていました。コードを書いてエラーが発生したNo 'Access-Control-Allow-Origin' header is present on the requested resource.ので、いくつかのグーグルを行ったところ、Jsonpを使用してクロスドメインリクエストを作成できることがわかりました。したがって、私は単純に $.ajax 関数を使用して、このURLにリクエストを送信したり、この単純な 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. コードの何が問題なのかわかりません。さらに、コンソールでエラーが発生し、URL https://api.coursera.org/api/catalog.v1/courses/2Uncaught SyntaxError: Unexpected token :を使用する とエラーが発生します。2?callback=localJsonpCallback&_=1418037208234:1

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 に答える