以上demo简单解决了前端跨域通信，跨域带cookie等问题，在逻辑上完全可以实现跨域通信。但是对于不支持PostMessage特性的老版浏览器是行不通的。比如IE8-浏览器就不能很好的支持PostMessage特性。这种情况下我们采用另外一种中转跨域的方案：降子域通信。 下面介绍第二种方法：降子域通信：
2.不支持PostMessage时，降子域通信由于a.qq.com和b.qq.com都是属于qq.com下的子域，同源策略在前端页面中判定依据是document.domain而不是location.host。而document.domain可写，可以人为更改到其父域名。这样a.qq.com和b.qq.com的两个页面都可以自行降到qq.com。这样就可以直接进行通信。 主要核心逻辑代码可以参考： 【a.qq.com页面代码】
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <script> //a.qq.com中逻辑： document.domain="qq.com"; var $crossFrame=$("<iframe src='http://b.qq.com/proxy.html'></iframe>").appendTo(document.body); //等待iframe中转页面load完毕 $crossFrame.on("load",function(){ //回调 window['callback']=function(result){ //收到响应 console.log("receive response:",result); } //调中转页面中的方法直接请求 $crossFrame.get(0).contentWindow.request({ api:"/xx/y", data:{ a:1, b:2 } }); }) </script> </body> </html>【b.qq.com页面代码】
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <script> //b.qq.com中逻辑： document.domain="qq.com"; window.request=function(api,data){ $.ajax({ url:api, data:data, //....... success:function(result){ //将response返回给a.qq.com window.parent.callback(result,"*") }, fail:function(){ } }) } </script> </body> </html>在实际改造过程中，如果后端结果过多，或者改造不方便，可以直接采用第二种方式——中转代理的方式进行改造。其原理示意图总结如下：
其实文件上传是HTML规范内的，理论上不需要使用Flash去做。但是随着ajax技术的兴起，Web 2.0时代的到来，input表单的提交改成ajax提交，页面无刷新的形式。但是这种形式下对于文件这类二进制文件无法提交，IE下本来有ActiveX 的FSO可以操作，但是插件的执行需要IE安全机制允许，很多情况下用户体验不好，而且兼容性也不是很好。于是这种背景下，FLash又担当起了一个新的功能：文件上传。 著名的jquery插件，ajaxupload.js就是用的Flash进行文件提交。
3.2去Flash上传如何不使用Flash，上传文件，而且保证页面不刷新，是我们在去Flash上传工作中需要做的核心。下面针对不同的浏览器提供两套方案：
3.2.1 【第一套方案】HTML5获取文件信息用FormData提交条件：支持HTML5 FileReader 和FormData 特性 做法：
1.获取input表单的files对象 2.实例化FileReader对象，并解析files对象 3.解析之后输出base64编码的文件数据 4.base64的数据传入FormData 5.ajax提交FormData
参考demo如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <input type="file" /> <script> $("#test").change(function(e){ var files=e.target.files; va fr=new FileReader(); fr.onload=function(e){ var fm=new FormData(); fm.append("file_test",e.target.result); //额外参数 fm.append("sExtend","test"); //提交ajax $.ajax({ url:'http://b.qq.com/cgi/', type:"POST", dataType:json, data:fm, processData: false, // 不会将 data 参数序列化字符串 contentType: false, // 根据表单 input 提交的数据使用其默认的 contentType success:function(result){ console.log(result); }, fail:function(){ console.log("failed"); } }); } fr.readAsDataURL(files[0]); }); </script> </body> </html> 3.2.2 【第二套方案】低版本浏览器中用模拟表单提交条件：无任何条件，支持任何浏览器 做法：
1.在页面上构建一个隐藏的iframe 2.在页面上构建一个form表单，表单中包含文件表单和其它附加字段表单,target设为上述iframe的id 3.上传文件动作触发时，调用form的submit方法 4.iframe中加载上传cgi，返回结果与父窗口通信，如果iframe与cgi跨域，则参考【第二部分：跨域请求】进行处理