Question

我正在学习Ajax并尝试从网页中的URL中提取一些数据。我使用的代码大部分都很简单，在下面提供，

<!DOCTYPE html>
<html>

    <head>
      <title>The Design Patterns</title>
    </head>

    <body>

    <h1>The XMLHttpRequest Object</h1>

    <p id="demo"></p>

    <script>

      var url =  "https://www.w3schools.com/xml/cd_catalog.xml";
      // var url = "cd_catalog.xml";

      var xhttp, xmlDoc, txt, x, i;

      xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {

      if (this.readyState == 4 && this.status == 200) {
        xmlDoc = this.responseXML;
        txt = "";
        x = xmlDoc.getElementsByTagName("ARTIST");
        for (i = 0; i < x.length; i++) {
          txt = txt + x[i].childNodes[0].nodeValue + "<br>";
        }
        document.getElementById("demo").innerHTML = txt;
        }
      };
      xhttp.open("GET", url, true);
      xhttp.send();
    </script>

    </body>
</html>

但是，代码未按预期执行。我在控制台中收到一些错误，

XMLHttpRequest cannot load https://www.w3schools.com/xml/cd_catalog.xml. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

似乎我需要在代码中提供Access-Control-Allow-Origin标头。我阅读了关于using the CORS的文章，但到目前为止我还不是很清楚。

有关如何做到这一点的任何建议？有一个类似的问题有许多答案，包括使用Node.js，但是，它对我没有帮助。

用于获取某些数据的Ajax代码

0 个答案: