利用iframe解决跨域问题

利用iframe解决跨域问题

该图要解决的问题说明如下：
在AAA.com域名下的index.htm页面中内嵌了BBB.com域名下的一个页面index.htm，正常情况下iframe内部的index.htm页面是无法访问父页面index.htm中的任何dom对象或者js函数的，因为跨域，但我们经常又需要做一些参数回传的事情怎么办呢？以上的这种实现方式就很好的解决了这个问题；
解决方案的关键优雅之处在于：浏览器虽然会禁止js跨域访问页面中的对象，但对于iframe的层级关系引用并没有做限制，即parent仍然可用；该方案就是利用了2层内嵌iframe、使用第二级iframe中的页面与parent.parent的页面是同域名的关系，从而避免跨域问题实现两个页面间相关数据的传递，本质上就是利用parent.parent实现对父父页面中js的回调！
A域下的页面 enter.jsp

<script type="text/javascript" src="<%=basePath%>userindex/js/ui/jquery.js"></script>
<script type="text/javascript">
function process(par){
	//种cookie
	var strs = par.split("="); //字符分割
	setCookie("cookiename",strs[1],'d30');
}
//程序代码
function setCookie(name,value,time)
{
    var strsec = getsec(time);
    var exp = new Date();
    exp.setTime(exp.getTime() + strsec*1);
    document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString()+";path=/;domain=youku.com";
}
function getsec(str)
{
   var str1=str.substring(1,str.length)*1;
   var str2=str.substring(0,1);
   if (str2=="s")
   {
        return str1*1000;
   }
   else if (str2=="h")
   {
       return str1*60*60*1000;
   }
   else if (str2=="d")
   {
       return str1*24*60*60*1000;
   }
}
</script>
<iframe id="aframe" src="http://www.BBB.com/getCookie.jsp" width="320" height="240"></iframe>

B域下的页面：getCookie.jsp

<script type="text/javascript" language="javascript">
	function getCookie(c_name){
		if(document.cookie.length>0){
		   c_start=document.cookie.indexOf(c_name + "=");
		   if(c_start!=-1){
		     c_start=c_start + c_name.length+1;
		     c_end=document.cookie.indexOf(";",c_start);
		     if(c_end==-1) c_end=document.cookie.length;
		     //alert(unescape(document.cookie.substring(c_start,c_end)));
		     return unescape(document.cookie.substring(c_start,c_end));
		   }
		}
	}
	(function(){
		 //动态创建iframe，利用iframe的src传递cookie值
		 var ifr = document.createElement("IFRAME");
		 document.body.appendChild(ifr);
		 ifr.src = 'http://www.AAA.com/pass.jsp?p='+getCookie("yktk");
	})();
</script>

A域下的页面：pass.jsp

<script type="text/javascript" src="<%=basePath%>userindex/js/ui/jquery.js"></script>
<script type="text/javascript">
(function(){
	//获取iframe的src中的参数
	var paramUrl = window.location.search;
	//调用iframe中的A域中的process方法，把参数传入，完成跨域
	parent.parent.process(paramUrl);
})();
</script>

参考资料： http://blog.csdn.net/sfdev/article/details/5807045