Question

我知道这是非常简单的代码，但是以某种方式无法正常工作。我要做的是调用的GET API：

https://api.upcitemdb.com/prod/trial/lookup?upc=4011200296908

我想使用JavaScript或Jquery来调用此HTML。我已经尝试了很多东西，但是没有用。以下代码我已应用但无法正常工作：

<!DOCTYPE html>
<html>
<body>

<button type="button" onclick="loadDoc()">Request data</button>

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      alert("responseText" + this.responseText);
    } else {
      alert("Error");
    }
  };
  xhttp.open("GET", "https://api.upcitemdb.com/prod/trial/lookup?upc=4011200296908", true);
  xhttp.send();
}
</script>

</body>
</html>

我还尝试通过使用Ajax与Jquery调用相同的API。以下是相同的代码：

<!DOCTYPE html>
<html>
<body>
<header>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</header>
<button type="button" onclick="loadDoc()">Request data</button>

<script>
function loadDoc() {
    $.ajax({
        url:"https://api.upcitemdb.com/prod/trial/lookup?upc=4011200296908",
        success:function(response){
          alert(response);          
        },
       error: function() {
        alert("Error");
        }
    });
}
</script>

</body>
</html>

Answer 1

那是经典之作！

如果打开“开发人员”标签（f12），可能会看到以下错误：

无法加载 https://api.upcitemdb.com/prod/trial/lookup?upc=4011200296908： “ Access-Control-Allow-Origin”标头具有一个值 'https://www.upcitemdb.com'

这意味着服务器https://api.upcitemdb.com不希望您使用除“ https://www.upcitemdb.com”之外的任何网站上的资源。如果您不拥有该站点，则无法加载该站点的资源，或者应要求管理员授予您的站点授权。如果您拥有它，则可以了解有关您的CORS配置的更多信息。

对api.upcitemdb.com端点的请求的CORS错误

1 个答案: