Question

我正在开发一个带有html5，css，js和jQuery Mobile的phonegap应用程序，我需要连接到已经完成并完全正常工作的web服务。问题是访问控制允许来源和跨域。好像它不够难，我也必须考虑身份验证，这对连接到Web服务至关重要。我已经完成了我的研究，阅读了很多内容，尝试了很多解决方案，其中一些使用了jsonP，这对我来说是最接近工作的。事情是我是新手，并没有教程看起来很好，所以希望有人在这里可以引导我的方式。 webService是在asp.net中构建的，如果需要，我可以完全访问它。我正在使用AJAX进行“调用”，但我无法通过ForeFront身份验证。

这是JS + AJAX代码：

function conteudoProg() {
    var webMethod = "myURL";
    var credentials = {
      username : "myUser",
      password : "myPass"
  };

$.ajax({
    type : "GET",
    url : webMethod,
    //data: credentials,
    contentType : "application/json; charset=utf-8",
    dataType : "jsonp",
    success : function(msg) {
        alert(msg);
    },
    error : function(e) {
        alert(e.status + " " + e.statusText );
    }
});
}

如果我将我的dataType从jsonp更改为json，我会收到此错误：

OPTIONS https://myURL 440 (Login Timeout) 
XMLHttpRequest cannot load https://myURL Origin http://127.0.0.1:8020 is not allowed by Access-Control-Allow-Origin.

使用jsonp，错误如下所示：

Resource interpreted as Script but transferred with MIME type text/html: "https://myURL/CookieAuth.dll?GetLogon?curl=Z2FWSInqueritosZ2FServ…1820135927463_1359737732559Z26_Z3D1359737732605&reason=0&formdir=3". jquery-1.8.2.min.js:2
Uncaught SyntaxError: Unexpected token <

Answer 1

对其他域的请求将导致转发前OPTIONS请求，以查看请求域是否可以对此域进行调用。

接收端需要发出正确的标题，否则您的浏览器会阻止请求并向您发送您发布的错误。

假设您要求mydomain.com至webservice.com

然后webservice.com/api会发出以下标题：

Access-Control-Allow-Origin: http[s]://mydomain.com
Access-Control-Allow-Credentials: true                      # if you want cookies
Access-Control-Allow-Headers: Content-Type, X-Custom-Header # any extra headers you want to send

确保网络服务知道OPTIONS个请求。它实际上只需要发出一些CORS头，它不需要做任何其他事情（比如处理对它的API的请求）。

您不需要在AJAX处理程序中更改任何内容，它将像任何其他请求一样传递。如果您想要Cookie，请务必设置http_request.withCredentials = true;

请注意，HTTPS网址被视为与HTTP网域不同，确保您的HTTPS证书有效，如果无效，请求可能会无提示失败。如果您使用的是自签名证书（用于测试），请将其添加到浏览器或操作系统白名单中。 Cross domain request from HTTP to HTTPS aborts immediately

兼容性。早期版本的Internet Explorer（8及更低版本）使用ActiveXObject，这个API在CORS上非常糟糕。它不支持身份验证/ Cookie或自定义标头（例如Content-Type: application/JSON）。我建议使用 JSONp 后备。

Answer 2

代码不起作用，因为当你告诉jQuery .ajax方法需要一个dataType json时，那就是试图解析响应的内容。如果响应是html，那么你应该使用dataType html（或者没有，让默认的智能猜测做它的工作）。有关详细信息，请参阅jQuery.ajax() dataType。

使用AJAX和CORS连接到Web服务

2 个答案: