Question

获取错误消息＆＃34; XMLHttpRequest无法加载http://api.vateud.net/notams/warj.json。 No＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。起源＆＃39; http://run.plnkr.co＆＃39;因此不允许访问＆＃34;

这里是plunker链接：http://plnkr.co/edit/Kt340aO4WTYPb5sjCUDj?p=preview

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
    <div class="div"></div>

<script>

        $.ajax({
               type: "GET",
               url: "http://api.vateud.net/notams/warj.json",
               processData: true,
               data: {},
               dataType: "json",
               error: function(){ alert("Error"); },
               success: function (data) {
                   $.each(data, function(i,item){

                    $("<p>").html(item.raw).appendTo(".div");

                  });
               }
        });

</script>
</body>
</html>

Answer 1

错误是由于CORS，即交叉原始请求，您收到错误：

XMLHttpRequest cannot load http://api.vateud.net/notams/warj.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

在此处了解有关CORS的更多信息"No 'Access-Control-Allow-Origin' header is present on the requested resource" ..

还要在您的系统上运行下面的代码示例，您将在控制台中看到任何其他错误。

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="div"></div>
    
    <script>
    
            $.ajax({
                   type: "GET",
                   url: "http://api.vateud.net/notams/warj.json",
                   processData: true,
                   data: {},
                   dataType: "json",
                   error: function(e){
                    console.log(e);                    
                   },
                   success: function (data) {
                       $.each(data, function(i,item){
                        $(".div").append('<p>'+item.raw+'</p>');
                      });
                   }
            });
    
    </script>

从外部URL获取JSON数据并将其显示在div中，但不起作用

1 个答案: