A-A+

iframe跨域传递或修改数据方法

2016年10月17日 web前端设计 暂无评论 阅读 6 views 次

本文章来给大家介绍关于frame、iframe跨域传递或修改数据方法,有需要了解利用iframe跨域传递数据的操作方法,有需要了解的朋友可进入参考.

本文示例基础,使用frameset、frame分割窗体,下面代码是典型的网站后台模式,顶部为bannner栏,下面左右分割两部分,当然也可以使用Javascript结合table标签等实现同样功能,代码如下:

  1. <frameset>  
  2.     <frame name="banner" src="banner.php">  
  3.     <frameset cols="150,*">  
  4.         <frame name="left" target="right" src="left.php">  
  5.         <frame name="right" src="right.php">  
  6.     </frameset>  
  7.     <noframes>  
  8.     <body>  
  9.     <p>不支持框架</p>  
  10.     </body>  
  11.     </noframes>  
  12. </frameset>  

一、为FRAME跨域赋值

通过top并使用getElementsByTagName实现跨FRAME提交数据,方法如下,比如right.php内容如下,通过Javascript修改banner文档中的值,代码如下:

  1. <script type="text/javascript">  
  2. try{window.top.banner.document.getElementsByTagName('div')[0].innerHTML='我是标题';}  
  3. catch(e){}  
  4. </script>  

二、跨域修改表单等元素,可以使用类似这样的JS脚本,代码如下:

1 var obj=parent.otherFrameName.document.forms[0].xxx;

来获取表单控件对象,然后进行赋值即可。

三、通过GET方法跨FRAME提交数据

修改frame的src属性,然后把需要传递的值通过GET方法传递,不过要求数据接收方添加相应的接收处理脚本,通过GET方法一般可以实现一些简单的数据传递,如果要实现动态跨FRAME修改页面元素还是有些复杂,不如上面的方法要简单点,代码如下:

  1. <script type="text/javascript">  
  2. try{window.top.banner.src='banner.php?title=我才是标题';}  
  3. catch(e){}  
  4. </script>  

四、使用cookie或SESSION跨域传递数据

通过A域设置COOKIE值或SESSION值,然后动态通过JS脚本跨域刷新页面,再次读取COOKIE或SESSION,来达到传递数据目的,不过如果frame源地址是第三方地址,使用COOKIE,可能会因为浏览器的阻止导致失效。似乎还可以通过发送设置P3P头达到规避效果,不过暂时没有验证过。

五、内嵌框架iframe的数据传递

iframe传递数据相对要简单一些,毕竟还都在同一个文档中,直接使用parent来获取父容器,代码如下。

  1. <div id="abc">  
  2. <div id="Content">https://www.xiariboke.com</div>  
  3. <iframe id="iframe1" src="test.html" ></iframe>  
  4. </div>  
  5. //test.html  
  6. <script type="text/javascript">  
  7. function change(){  
  8. parent.document.getElementById("Content").innerHTML = "天缘博客";  
  9. }  
  10. </script>  
  11. <input type="button" id="buttion1" onclick="change();">  

iframe中跨域传递COOKIE,直接讲解决方案,PHP的程序,可以直接在B网站中写入如下代码:

  1. <?php  
  2. header(‘P3P: CP="CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR"’)  
  3. ?>  

这样就能接受第三方的Cookie啦。

lighttpd的服务器,代码如下:

server.modules = ("mod_setenv")

setenv.add-response-header = ( "P3P" => "CP=’CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR’")

apache的服务器,代码如下:

  1. <VirtualHost>  
  2. Header set P3P ‘CP="CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR"’  
  3. </VirtualHost>  

IIS的服务器

增加一个网站http头来解决问题;

管理工具——〉选择一个网站——〉属性——〉http头,增加一个http头

然后输入头名:P3P

输入头内容:CP=CAO PSA OUR

给我留言