对于javascript访问信息，API必须具备哪些要求?

What requirements does an API have to have for javascript to access information?

本文关键字：访问 javascript 信息 API 对于      更新时间：2023-09-26

在我继续之前，我应该证明我是javascript的新手。我有c#和VBA的经验，但有一些web的想法是需要一些理解。

作为一个副项目，我试图从幻想的英超联赛API拉数据(见这里的一个例子)。我一直在关注其他堆栈溢出查询和w3s在线教程，并有基本代码试图拉下面的数据:

function getData() {
var element = document.getElementById("data");
var url = "http://fantasy.premierleague.com/web/api/elements/1/";
var text;
$.getJSON(url, function (player) {
    $.each(player, function (key, val) {
        text += key + ": " + val + "<br>";
    });
});
element.innerHTML = text;}

问题是，我一直得到同样的错误时，运行这个通过chrome:

XMLHttpRequest无法加载http://fantasy.premierleague.com/web/api/elements/1/。没有"访问-控制-允许-起源"标头出现在请求上资源。

是我的代码有问题，还是有一些关于API的东西，这意味着我的代码无法访问它?可以访问上面的链接并查看JSON文件，所以如果javascript代码有访问限制，为什么这是可能的?

请参阅下面的javascript代码片段。

function getData() {
    var element = document.getElementById("data");
    var url = "http://fantasy.premierleague.com/web/api/elements/1/";
    var text;
    $.getJSON(url, function (player) {
        $.each(player, function (key, val) {
            text += key + ": " + val + "<br>";
        });
    });
    element.innerHTML = text;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<title>FantasyFootballData</title>
<body>
    <button onclick="getData()">Get first player data</button>
    <p id="data"></p>
</body>

这里的问题被称为同源策略。你不能用javascript/ajax访问来自不同域的资源，除非服务器设置了一些报头(这些报头作为看门人，他们将给定的域列入白名单，允许它们执行调用，并告诉客户端允许执行哪些动词/动作)。您应该阅读更多关于CORS(跨域资源共享)的内容，并评估通过JSONP或使用代理客户端执行请求的可能性，以实现您想要的结果。

相关文章：