javascript - 是否可以跨域使用 XMLHttpRequest

Question

可以通过 JavaScript 跨站 XMLHttpRequest 吗？

我理解限制以及为什么它通常不能工作，但是从 firefox 3.5 开始有

访问控制允许来源:*

这应该允许它工作。

它告诉浏览器服务器不关心请求是否来自不提供该页面的域。

我使用的代码如下。

function sendData(webservicePayload, callbackFunction) {
var request = null;
if (!window.XMLHttpRequest) { // code for IE
    try {
        request = new ActiveXObject('Msxml2.XMLHTTP');
    } catch (e) {
        try {
            request = new ActiveXObject('Microsoft.XMLHTTP');
        } catch (E) {
            return 'Create XMLHTTP request IE';
        }
    }
} else { // code for Mozilla, etc.
    request = new XMLHttpRequest();
}
/*
 * Setup the callback function
 */
request.onreadystatechange = function() {
    if (request.readyState == 4 && request.status < 300) {
        eval(callbackFunction);
    }
};
if (!request) {
    nlapiLogExecution('ERROR', 'Create XMLHTTP request', 'Failed');
    return;
}
/*
 * Setup the request headers
 */

request.open('POST','http://www.another.domain.co.uk/webservice.asmx', true);
request.setRequestHeader('Man','POST http://www.another.domain.co.uk/webservice.asmx HTTP/1.1');
request.setRequestHeader('MessageType', 'CALL');
request.setRequestHeader('Content-Type', 'text/xml; charset="utf-8"');
request.setRequestHeader('Cache-Control', 'no-cache');
request.setRequestHeader("X-Requested-With", "XMLHttpRequest");
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

request.setRequestHeader('SOAPAction','http://www.another.domain.co.uk/WebService/eService');
request.send(webservicePayload);

这是发送正确的请求头

请求

OPTIONS /webservice.asmx HTTP/1.1
Host: www.another.domain.co.uk
User-Agent: Mozilla/5.0 (Windows NT 6.1; rv:8.0) Gecko/20100101 Firefox/8.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-gb,en;q=0.5
Accept-Encoding: gzip, deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Origin: https://my.domain.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: cache-control,content-type,man,messagetype,soapaction
Pragma: no-cache
Cache-Control: no-cache

并接收到一个预期的响应头

回应

HTTP/1.1 403 Forbidden
Server: Microsoft-IIS/5.1
Date: Wed, 14 Dec 2011 13:43:27 GMT
X-Powered-By: ASP.NET
Access-Control-Allow-Origin: *
Connection: close
Content-Type: text/html
Content-Length: 44

如您所见，请求中指定了 Orgin，服务器响应接受任何 ("*") 域。

为什么我会收到“Forbidden 403”，因为我觉得我所做的一切都是正确的，但我无法弄清楚为什么？

还有其他人得到这个吗？

你知道是什么原因造成的吗？

Answer 1

CORs 请求实际上由两个物理 HTTP 请求组成:1) 预检请求，以及 2) 实际请求。您在上面发布的请求看起来像预检请求，因为它使用了 HTTP OPTIONS 方法。因此，您要做的第一件事就是验证您的服务器是否接受 OPTIONS 请求(我相信这应该可以正常工作，但它可以解释您收到 403 的原因)。

接下来，您需要一个有效的飞行前响应。对预检请求的响应还必须包含以下两个 header :

Access-Control-Allow-Methods: POST
Access-Control-Allow-Headers: Origin,cache-control,content-type,man,messagetype,soapaction

(查看这些响应 header 如何回应 Access-Control-Request-Method 和 Access-Control-Request-Headers 请求 header )。 Access-Control-Allow-Headers header 应包含任何自定义请求 header 。

一旦浏览器收到此响应，它就知道预检请求已被接受，并发出实际请求。在实际请求中，您只需要以下 header :

Access-Control-Allow-Origin: *

您可以在此处了解有关预检请求和处理 CORS 请求的更多信息:http://www.html5rocks.com/en/tutorials/cors/