设为首页收藏本站

PHPIN.NET

 找回密码
 立即注册
查看: 506|回复: 0

[高级进阶] 跨域上传并返回结果

[复制链接]

32

主题

34

帖子

359

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
359
发表于 2014-9-25 17:13:27 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
首先是一个正常的上传页面 upload.html
  1. <form method="post" target="if" enctype="multipart/form-data" action="http://www.ceshi.com/upapi.php?cb=http://shiyan.yonglan.net/shangchuan/tmp.html">
  2.         <input type="file" name="file" />
  3.         <input type="SUBMIT" value="upload" />
  4. </form>
  5. <IFRAME id="if" name="if" src="about:blank" frameborder='0'></IFRAME>
  6.       <script>
  7.         // 这个函数将来会被iframe用到
  8.         function getIframeVal(val)
  9.         {
  10.                         if(val){
  11.                             alert(val);
  12.                         }
  13.                
  14.         }
  15. </script>
复制代码

这里有一个关键点是form的target要指向iframe,同时把iframe隐藏起来,这样上传的处理结果就会显示在该iframe里。action里的cb(callback)参数表示处理完成后要跳转的url,因为我们的目标是iframe,所以只会把跳转的页面输出到iframe,而不会让当前页面跳转。
还有一点,callback url要和当前页面同域。跨域的iframe无法调用父页面的内容。
再来看看form的action   php内容
  1. <?php  
  2.        move_uploaded_file($_FILES['file']['tmp_name'],'upload/' . $_FILES['file']['name']); //存储上传的文件  
  3.      //    print_r($_FILES);
  4.        $data = $_FILES['file']['name'];
  5.        header('location:'.$_GET['cb'].'?file_id='.$data);
  6. ?>
复制代码


这里可以处理文件,然后入库。操作完成后,把文件的id及其他信息都放在url里,最后跳转到这个url。(示例并未做任何数据验证)
最后来看看tmp.html,也就是刚刚deal.php跳转到的url,这个文件的内容会填充到页面的iframe里。

  1. <script type="text/javascript">
  2.         var rs = window.location.search.split('?').slice(1);
  3.         window.parent.getIframeVal(rs.toString().split('=').slice(1));
  4. </script>
复制代码


您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|PHPIN.NET ( 冀ICP备00000001号 )|网站地图  

GMT+8, 2016-12-10 20:42

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表