Question

我正在尝试使用XMLHTTPRequest进行发帖，并收到以下消息：

在以下位置访问XMLHttpRequest 原产地的“ https://some-link” “空”已被CORS政策阻止：对预检请求的响应没有通过访问控制检查：否'Access-Control-Allow-Origin' 标头出现在请求的资源上。

有类似的线程说要添加CORS标头，而我已经在其中完成了。

我很好奇的是，当转换为AJAX时，这些完全相同的代码可以很好地工作（而不必让其他代码通过CORS配置）。由于AJAX只是基于JavaScript构建的框架，为什么在不使用AJAX进行编码而仅使用JavaScript进行编码时会显示此消息？

var xhr = new XMLHttpRequest()
xhr.open('POST', url, true)
xhr.send(data)

vs。

$.ajax({
    type: 'POST',
    url: 'url',
    data: data
});

后期工作正常。 Ajax中有哪些其他/隐藏的实现？

Answer 1

打开DOM Inspector，单击请求并找到这两个请求之间的区别。会有所不同。

“空”起源可能是因为您将IFRAME与属性沙箱一起使用，对吗？要解决此问题，您需要确保

请求的资源（在网络面板中）在RESPONSE标头中返回“ Access-Control-Allow-Origin”（您说完成了此操作）
请记住，预检检查使用OPTIONS请求（无论是GET还是POST），因此请确保在使用OPTIONS请求请求资源时，服务器发送上述标头。如果是这种情况，您应该在CORS错误之前立即在控制台中看到一些有关OPTIONS请求的错误消息。（例如，默认情况下，NGINX响应错误405回应OPTIONS请求。）

您可以像这样使用命令行curl进行检查 curl 'https://www.example.com/my-url-that-fails-here/' -X OPTIONS -H 'Pragma: no-cache' -H 'Access-Control-Request-Method: GET' -H 'Origin: null' -H 'Accept-Encoding: gzip, deflate, br' -H 'Accept-Language: en-US,en' -H 'User-Agent: Mozilla/5.0' -H 'Accept: */*' -H 'Access-Control-Request-Headers: x-requested-with' --compressed -D - -O /dev/null 这应该非常接近真实的浏览器。

对预检请求的响应未通过访问控制检查（JavaScript）

1 个答案: