使用 AJAX 和 CORS 连接到 Web 服务
Connect to webService using AJAX and CORS
我正在开发一个带有html5,css,js和jQuery Mobile的phonegap应用程序,我需要连接到已经完成并完全工作的Web服务。问题是访问控制允许源和跨域。好像这还不够难,我还必须考虑身份验证,这对于连接到 Web 服务至关重要。我已经完成了研究,阅读了很多tuts,尝试了很多解决方案,其中一些使用jsonP,在我看来这是最接近工作的解决方案。问题是我是新手,没有教程看起来不错,所以希望这里有人可以带我走。网络服务是 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 );
}
});
}
如果我将我的数据类型从 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 <
对另一个域的请求将导致预检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
确保 Web 服务知道OPTIONS
请求。它实际上只需要发出一些 CORS 标头,它不需要做任何其他事情(例如处理对其 API 的请求)。
您无需更改 AJAX 处理程序中的任何内容,它将作为任何其他请求传递。如果您想要 Cookie,请确保设置http_request.withCredentials = true;
请记住,HTTPS URL 被视为与 HTTP 域不同,并确保您的 HTTPS 证书有效,如果无效,请求可能会以静默方式失败。如果您使用的是自签名证书(用于测试),请将其添加到浏览器或操作系统白名单中。从 HTTP 到 HTTPS 的跨域请求立即中止
至于兼容性。早期版本的Internet Explorer(8及更低版本)使用ActiveXObject
,此API在CORS上非常糟糕。它不支持身份验证/cookie 或自定义标头(例如 Content-Type: application/JSON
)。我会推荐一个JSONp回退。
代码不起作用,因为当您告诉 jQuery .ajax 方法需要 dataType json 时,这就是尝试解析响应的内容。如果响应是 html,那么您应该使用 dataType html(或 none,让默认的智能猜测完成它的工作)。请参阅 jQuery.ajax() dataType 了解更多信息。
- 基于api密钥的NodeJS web服务
- 使用javascript在客户端上使用Web服务
- 如何通过安全的https连接在javascript中使用基于soap xml的Web服务
- 从Javascript连接到SOAP Web服务
- 如何将javascript对象作为参数传递到c#web服务中
- AngularJS:使用维基百科API的web服务
- 从javascript调用C#Web服务并使用它(json格式)
- 从简单的html页面调用实时Web服务.
- 在JavaScriptAjax调用中从web服务中的XMLDocument获取响应.
- 如何使用 javascript 从 Web 服务重新加载项目集合
- 创建web服务“;活动指示器”-与所有浏览器兼容的类似指示符
- 如何将WinJS ListView绑定到web服务
- Ajax不调用Web服务
- 将web服务回调的结果绑定到Javascript中的调用函数
- 如何创建可从多个应用程序使用的PHP登录web服务
- Ajax发布到双节点NLB上的web服务
- 无法使用javascript客户端访问远程web服务
- 使用带有AngularJS的DocRaptor web服务
- 如何使用phonegap在android中调用asp.net Web服务
- 如何使应用程序加载独立于web服务调用