博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iframe无刷新跨域上传文件并获取返回值
阅读量:5037 次
发布时间:2019-06-12

本文共 658 字,大约阅读时间需要 2 分钟。

通常我们会有一个统一的上传接口,这个接口会被其他的服务调用。如果出现不同域,还需要无刷新上传文件,并且获取返回值,这就有点麻烦了。比如,新浪微博启用了新域名www.weibo.com,但接口还是使用原来的域:picupload.t.sina.com.cn。

研究了一下新浪微博的处理方法,这里大概演示一下。

首先是一个正常的上传页面 upload.html

  

这里有一个关键点是form的target要指向iframe,同时把iframe隐藏起来,这样上传的处理结果就会显示在该iframe里。action里的cb(callback)参数表示处理完成后要跳转的url,因为我们的目标是iframe,所以只会把跳转的页面输出到iframe,而不会让当前页面跳转。

还有一点,callback url要和当前页面同域。跨域的iframe无法调用父页面的内容。

再来看看deal.php,也就是form的action

  

这里可以处理文件,然后入库。操作完成后,把文件的id及其他信息都放在url里,最后跳转到这个url。

最后来看看deal_cd.html,也就是刚刚deal.php跳转到的url,这个文件的内容会填充到页面的iframe里。

1 

 

这里调用了父窗口的getIframeVal方法,这样父页面就获得了文件的id。

转载于:https://www.cnblogs.com/mrxigua/p/3217287.html

你可能感兴趣的文章
spring回滚数据
查看>>
新浪分享API应用的开发
查看>>
美国专利
查看>>
【JavaScript】Write和Writeln的区别
查看>>
百度编辑器图片在线流量返回url改动
查看>>
我对你的期望有点过了
查看>>
微信小程序wx:key以及wx:key=" *this"详解:
查看>>
下拉框比较符
查看>>
2.2.5 因子的使用
查看>>
css选择器
查看>>
photoplus
查看>>
Python 拓展之推导式
查看>>
[Leetcode] DP-- 474. Ones and Zeroes
查看>>
80X86寄存器详解<转载>
查看>>
c# aop讲解
查看>>
iterable与iterator
查看>>
返回顶部(动画)
查看>>
webpack+react+antd 单页面应用实例
查看>>
Confluence 6 SQL Server 数据库驱动修改
查看>>
Confluence 6 通过 SSL 或 HTTPS 运行 - 备注和问题解决
查看>>