jsonp VS W3C 的Cross-Origin Resource Sharing

才看到W3C的cross original resource sharing，又多了一种跨域的选择.

（官方的跨域解决出现了，看了下文档时间貌似很久了...我果然很out）


那和民间标准jsonp 比有啥优势呢：

1.支持多种http方法

jsonp一般只支持get方法。

而w3c的cross orginal resouce sharing 支持http的其他几种方法，例如put，delete...

2.简单

对于服务端来说，设置一个response head 就能搞定W3C CORS，

Access-Control-Allow-Origin: http://your site

检查下origin就可以选择是否要返回response.


而对于jsonp来说,要进行安全检查

3.安全

这个就不废话了，jsonp就是script注入，跨站攻击一般都会考虑....

劣势：

这玩意儿要看浏览器颜色,和HTML5一样 不是谁都可以用的........
----------------------------------------------------------------------

W3C CORS客户端实现

只搞了FF的，IE的貌似是XDomainRequest.....下次补上

var XCOS = function(type,url){
      var xhr = new XMLHttpRequest();
      
      if (xhr && "withCredentials" in xhr){
            xhr.open(type, url, true);
      } 
      else xhr = null;
      var success = function(msg,obj){
            alert(msg);
      };
      var error = function(obj){
            alert("error");
      };
      var handle_load = function (event_type) {
            return function (XHRobj) {
            if (event_type == 'load' && (XHRobj.readyState == 4) && success)
                  success(XHRobj.responseText, XHRobj);
            else if (error)
                  error(XHRobj);
            };
      };

      try {
            xhr.withCredentials = true;
      } catch(e) {};

      xhr.onload = function (e) { handle_load('load')(e.target); };
      xhr.onerror = function (e) { handle_load('error')(e.target); };
      xhr.send();
};

W3C 服务端代码：

response.setHeader("Access-Control-Allow-Origin","xyz")
response.setHeader("Access-Control-Allow-Methods","get")

最后 我承认以下写的比我好多了

http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors

http://www.w3.org/TR/cors/

评论

1 楼 巴巴米 2013-10-10  

最后一段是精华。。。