是否可以跨域使用XMLHttpRequest

时间:2011-12-15 17:17:46

标签: javascript ajax browser cross-domain

可以从JavaScript完成跨站点XMLHttpRequest吗?

我理解这些限制以及为什么它通常无法正常工作,但是从Firefox 3.5开始就有

Access-Control-Allow-Origin: *

应该允许它工作。

它告诉浏览器服务器不关心是否从未提供页面的域发送请求。

我正在使用的代码如下。

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);

}

这是发送正确的请求标头

REQUEST

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

并收到预期的回复标题


RESPONSE
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在请求中指定,服务器响应任何(“*”)域。

为什么我得到“禁止403”因为我觉得我所做的一切都是正确的,我无法理解为什么?

还有其他人得到这个吗?

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

1 个答案:

答案 0 :(得分:3)

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

接下来,您需要有效的预检响应。对预检请求的响应还必须包含以下两个标题:

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

(请参阅这些响应头如何是Access-Control-Request-Method和Access-Control-Request-Headers请求头的回显)。 Access-Control-Allow-Headers标头应包含任何自定义请求标头。

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

Access-Control-Allow-Origin: *

您可以在此处详细了解预检请求和处理CORS请求:http://www.html5rocks.com/en/tutorials/cors/