在很多 XHR 封装中都会对请求头的 Content-Type 字段做设置,比如 jQuery 默认使用「application/x-www-form-urlencoded」,这个是完全没问题了,即使是 CORS,且目标服务器没有设置「Access-Control-Allow-Headers」也没问题。但如果使用其他类型就不行了。
jQuery::ajax VS Angular::$http
CORS 时默认只支持「application/x-www-form-urlencoded」,所以 jQuery 的 ajax 方法可以正常工作,而 Angular 的 $http 由于默认使用「application/json」所以在服务器的「Access-Control-Allow-Headers」缺省时无法请求成功。可以使用下面代码测试(请自带 jQuery 和 Angular)。
//nodejs
require('http').createServer(function(req,res){
res.setHeader('Access-Control-Allow-Origin','*');
res.end('ok');
}).listen(1234);
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script>
$.ajax({
type:"post",
url:"http://127.0.0.1:1234/",
data:{a:1},
}).done(function(e){
console.log("jQuery OK");
});
angular.module("app",[]).controller("ctrl",["$http",function($http){
$http({
method:"post",
url:"http://127.0.0.1:1234/",
data:{a:1}
}).success(function(e){
console.log("Angular OK");
});
}]);
</script>
<body ng-app="app" ng-controller="ctrl"></body>
谁的责任?将来会如何?
当然只要做一些手动调整就可以解决这个问题,而且 Angular 的「application/json」确实是更先进的东西,Angular 没有错,jQuery 也没有错,错的应该是 CORS,是浏览器提供的默认支持程度太低。实际上「applications/json」同「application/x-www-form-urlencoded」一样是安全的,也是标准的,只是浏览器目前支持的还不好而已。我相信过不了多久「Access-Control-Allow-Headers」缺省时对这些的支持应该也会有。
本文来源于广州网站建设公司与广州网站设计制作公司-广帆互动广州公司!
日期:2015年05月20日
标签: 广州网站设计公司 、 广州网站设计 、 广州网站建设公司 、 广州网站建设 、 广州网站制作公司 、 广州网站制作 、 高端网站设计 、 高端网站建设 、 广州高端网站设计 、 广州高端网站建设