Question

我今天刚刚编写了我的第一个JavaScript代码。在我的本地机器上，我正在运行：

<!DOCTYPE html>
<html>
    <head>
    <title>Admin</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <script>
        function myTable()
        {
            var http = new XMLHttpRequest();
            var url = "MYSERVERADDRESS/login.php";
            var params = "username=ABC&password=123";

            http.open("POST", url, true);
            http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            http.onreadystatechange = function() {
                document.write("state = " + http.readyState + ", status = " + http.status);

                if(http.readyState == 4 && http.status == 200) {
                    document.write(http.responseText);
                }
            }

            http.send(params);
        }
    </script>
</head>
<body>
    <div>Test Page</div>
    <script>
        myTable();
    </script>
</body>
</html>

当我运行上述内容时，http.status返回0，因此文档写入永远不会发生。为什么会这样？

在阅读此事时我明白XMLHttpRequest出于安全原因，默认情况下不会允许跨域帖子。这可能是我在本地主机（笔记本电脑）上运行Javascript的原因，而我的服务器MYSERVERADDRESS是一个不同的域......这可能是一个CORS问题吗？

但是一篇在线文章建议在标题中使用它来克服这个问题：

    http.setRequestHeader('X-PINGOTHER', 'pingpong');

哪个不起作用。我还读到我需要让我的服务器知道我可以允许访问外部，所以我也将其包含在我的login.php端点中：

    //Set Access-Control-Allow-Origin with PHP
    header('Access-Control-Allow-Origin: *', false);

但这也没有奏效。（顺便说一下，我知道通配符*在这里非常糟糕，但是为了测试我只是想尝试快速结果）

我在这里有点难过。有人可以解释一下我做错了吗？

感谢@Quentin，这是我的浏览器开发者控制台输出：

:8383/favicon.ico:1 GET http://localhost:8383/favicon.ico 
net::ERR_EMPTY_RESPONSE
index.html:1 Failed to load MYSERVERADDRESS/login.php: Request header field X-PINGOTHER is not allowed by Access-Control-Allow-Headers in preflight response.
VM1389:207 Uncaught TypeError: target.hasAttribute is not a function
at MutationObserver.<anonymous> (<anonymous>:207:29)

XMLHttpRequest返回状态0

0 个答案: