如何通过Preflight Request从javascript中调用RESTWebservice

Question

我正试图从javascript本身调用另一个域中的服务。我可以请求跨域服务。但是我无法从服务中检索信息。一些我是如何被同源政策阻止的。请帮我找出代码中的错误。

我的客户端Javascript代码：

var requestJsonData;
function crossDomainCall(){  ** It will be called by button click **
    requestJsonData = createCORSRequest('POST', 'IPAddress/servicePath');
    if (requestJsonData){
        requestJsonData.onreadystatechange = handler;
        requestJsonData.send();
    }
    else {
        alert('Cross Domain Call is not invoked');
    }
}
function handler(evtXHR) {
    if(requestJsonData.readyState   ==  4) {
        if(requestJsonData.status   ==  200) {
            var response    =   requestJsonData.responseText;
        }
        else {
            alert(" Invocation Errors Occured " + requestJsonData.readyState + " and the status is " + requestJsonData.status);
        }
    }
    else {
        alert("currently the application is at " + requestJsonData.readyState);
    }
}
function createCORSRequest(method, url){
    var xhr;
        xhr = new XMLHttpRequest();
    if ("withCredentials" in xhr){
        xhr.open(method, url, true);
        xhr.setRequestHeader('X-PINGOTHER', 'pingpong');
    } else if (typeof XDomainRequest != "undefined"){
        xhr = new XDomainRequest();
        xhr.open(method, url);
    } else {
        xhr = null;
    }
    return xhr;
}

服务代码：

@OPTIONS
@Path("/servicePath")
@Produces("*/*")
@Consumes("*/*")
public Response corsRequest() {
    Response response   =   null;
    ResponseBuilder builder =   null;
    builder =   Response.ok();
    builder.header("Access-Control-Allow-Headers", "X-PINGOTHER");
    builder.header("Access-Control-Max-Age","1728000");
    builder.header("Access-Control-Allow-Origin","Origin_Ip_Address");
    builder.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS");
    builder.header("Content-Type","text/plain");
    builder.header("Connection", "Keep-Alive");
    response    =   builder.build();
    System.out.println("Exited from Options method");
    return response;
}
@POST
@Path("/servicePath")
@Produces("application/json")
public String drawRegions() {
    System.out.println("Entered inside Post method");
            // Some calculation to arrive jsonObject.
    return jsonObject;
}

从代码中，我收到了以下结果。

OPTIONS方法请求和响应标头

请求标头：

OPTIONS/SolartisGeoCodeLookUpService/Service/drawRegions HTTP/1.1

主机：Cross_Domain_IP_Address

用户代理：Mozilla/5.0（X11；Linux x86_64；rv:25.0）Gecko/20100101 Firefox/25.0

接受：text/html，application/xhtml+xml，application/xml；q=0.9，/；q=0.8

接受语言：en-US，en；q=0.5

接受编码：gzip，缩小

原点：原点_IP_地址

访问控制请求方法：POST

访问控制请求头：x-pingother

连接：保持有效

Pragma：无缓存

缓存控制：无缓存

响应标头

HTTP://1.1 200 OK

服务器：Apache Coyote/1.1

访问控制允许标头：X-PINGOTHER

连接：保持活动

访问控制允许来源：origin_IP_Address

访问控制最大年龄：1728000

访问控制允许方法：POST、GET、OPTIONS

内容类型：文本/纯

内容长度：0

日期：2013年12月12日星期四12:39:27 GMT

响应缓存头

来自缓存的响应标头

访问控制允许标头。。。X-PINGOTHER访问控制允许方法。。。发布，获取，选项访问控制最长年龄1728000连接保持活动内容长度0内容类型text/plain日期2013年12月12日星期四12:39:27 GMT服务器Apache Coyote/1.1访问控制允许原始原始_IP_Address

POST方法请求和响应标头

请求标头

POST/servicePath HTTP/1.1

主机：crossDomain_IP_Address

用户代理：Mozilla/5.0（X11；Linux x86_64；rv:25.0）Gecko/20100101 Firefox/25.0

接受：text/html，application/xhtml+xml，application/xml；q=0.9，/；q=0.8

接受语言：en-US，en；q=0.5

接受编码：gzip，缩小

X-PINGOTHER：乒乓

原点：原点_IP_地址

连接：保持有效

Pragma：无缓存

缓存控制：无缓存

内容长度：0

响应标头

HTTP://1.1 200 OK

服务器：Apache Coyote/1.1

内容类型：text/json

内容长度：128

日期：2013年12月12日星期四12:39:27 GMT

其他信息已经从javascript调用了两次处理程序方法。在第一次，它得到了"当前应用程序处于2"-readyState值。在第二次，它会出现"Invocation Errors Occured 4（readyState值）and status code is 0（response status code）"。第二次响应明确表示，调用服务已被同源策略停止。但我不知道如何克服这个问题，必须访问资源。请帮我更正代码。

Answer 1

与其在javascript中处理X域调用，为什么不开发一个应用程序本地的服务来使用另一个域中的web服务，然后可以从javascript中调用本地服务呢。

我还建议您使用jQuery来执行跨域Ajax调用，请参阅以下链接：http://www.pureexample.com/jquery/cross-domain-ajax.html.

没有必要直接处理XHR，因为您有jQuery为您做这件事。

希望这能有所帮助，

谨致问候。