- 浏览: 883097 次
- 性别:
- 来自: 杭州
文章分类
- 全部博客 (341)
- Ajax (1)
- Asp.net (18)
- Java (5)
- Php (27)
- JavaScript (19)
- jQuery (12)
- 正则表达式 (4)
- SEO优化 (1)
- Windows 应用 (5)
- Flash (12)
- Asp (9)
- CSS (10)
- SQL Server (6)
- Flex (1)
- Ubuntu (0)
- mysql (34)
- PHP框架 (2)
- Apache (10)
- html (3)
- 网页切入 (1)
- Linux (33)
- vc++ (38)
- 友情链接 (0)
- firefox 插件 (4)
- SEO (1)
- Apache 压力测试 (1)
- imacros教程(一):imacros变量 (0)
- JS调用imacros所用到的函数 (0)
- imacros教程(三):调用csv文件 (1)
- imacros教程(二):JS调用imacros所用到的函数 (1)
- imacros 常用代码 (1)
- CSS最大宽度 (1)
- svn (1)
- WordPress (1)
- 网线的两种接法 (1)
- TP-LINK WR 系列无线路由器安全设置 (1)
- mysql talble is full ERR1114 (0)
- 解决mysql的内存表“table is full”错误 (1)
- linux 用户操作 (1)
- CentOS 挂载 ntfs 移动硬盘 (1)
- linux 储蓄设备操作 (1)
- Starting MySQL. ERROR! Manager of pid-file quit without updating file. (1)
- extmail 1.1 升级到 1.2 (1)
- extmail (0)
- emos (2)
- squid 3.0 (2)
- centos 6 minimal 安装 (1)
- linux实用命令详解 (1)
- win7 (1)
- php 字符串大小写转换 (1)
- 跟踪路由 tracert (1)
- css英文单词首字母添加样式 (1)
- jquery iframe 操作 (1)
- php 获取时间今天明天昨天时间戳 (1)
- php 上传限制 (1)
- ckeditor 配置 (1)
- flash 显示在 div 下 (1)
- flash + php 留言本乱码问题 (1)
- squid purge 出现 access denied 的解决方法 (1)
- delphi (1)
- 让delphi嵌入的WebBrowser无边框无滚动条 (1)
- delphi打开一个IE窗口 (1)
- delphi 获取鼠标当前位置的相对坐标 (1)
- delphi 获取可执行文件的当前路径 (1)
- delphi webbrowser 常用方法示例 (1)
- javascript 禁止鼠标右键... (1)
- delphi 播放gif 动画 (1)
- delphi弹出信息框大全 (1)
- Delphi中禁止WebBrowser右键的方法 (1)
- DELPHI 让程序只能运行一次 (1)
- Delphi XE2 破解补丁注册机下载使用教程 (1)
- Delphi RAD Studio XE2编译程序体积大的问题 (1)
- delphi 制作圆角窗口 (1)
- delphi 窗口 (1)
- delphi 窗体全透明,但窗体上的控件不透明 (1)
- delphi 窗口阴影 (1)
- delphi 获取任务栏高度 (1)
- delphi bsNone 之后任务栏右键无反应 (1)
- delphi 程序打开隐藏软件任务栏条 (0)
- delphi bsNone后的相关问题解决方法 (1)
- delphi bsNone 后显示边框 (1)
- delphi url编码操作 (1)
- delphi 调用exe文件 (1)
- delphi dll窗体的制作和调用 (1)
- delphi dll 调用窗体时的数据传递 (0)
- delphi 窗口显示在屏幕右下角 (1)
- 内网穿透&UDP打洞 (1)
- delphi idhttp post应用 (1)
- inno setup 开机启动 (1)
- inno setup 添加桌面快捷方式 (1)
- Delphi实现程序只运行一次并激活已打开的程序 (1)
- 解决 float point division by zero (1)
- Delphi 窗体显示在最前面,并获得焦点 (1)
- delphi 点击关闭按钮时隐藏窗口 (1)
- delphi 非客户区右键点击 (1)
- delphi真正可以截获WINDOWS关机消息的源码 (1)
- delphi utf8转码 (1)
最新评论
-
zj7243886:
非常感谢,这东西解决我的问题;谢谢你的分享
Linux 安装 jpeg-6b 错误 ./libtool 命令未找到 -
丶Sk.Mabon:
能让html也绕过吗。。机房限制很悲剧
绕过 <?PHP exit(’Access Denied’); ?> 限制 -
丶Sk.Mabon:
请教gzip.php 的写法。万分感谢!
apache 开启 gzip -
hyxj1220:
火狐中单纯的定义这样的样式,貌似不行,必须要让容器浮动
英文长文本换行CSS -
逆水寒龙:
太好了,正好用上,谢谢博主共享
Asp.net 将中文汉字转换成拼音首字和拼音全拼
iframe无刷新跨域上传文件并获取返回值
通常我们会有一个统一的上传接口,这个接口会被其他的服务调用。如果出现不同域,还需要无刷新上传文件,并且获取返回值,这就有点麻烦了。比如,新浪微博启用了新域名www.weibo.com,但接口还是使用原来的域:picupload.t.sina.com.cn。
研究了一下新浪微博的处理方法,这里大概演示一下。
首先是一个正常的上传页面 upload.html
<script>
// 这个函数将来会被iframe用到
function getIframeVal(val)
{
alert(val);
}
</script>
<!-- 我把upload.com指向了127.0.0.1 -->
<form method="post" target="if" enctype="multipart/form-data" action="http://upload.com/playground/js/deal.php?cb=http://localhost/playground/js/deal_cd.html">
<input type="file" name="file" />
<input type="SUBMIT" value="upload" />
</form>
<IFRAME id="if" name="if" src="about:blank" frameborder='0'></IFRAME>
这里有一个关键点是form的target要指向iframe,同时把iframe隐藏起来,这样上传的处理结果就会显示在该iframe里。action里的cb(callback)参数表示处理完成后要跳转的url,因为我们的目标是iframe,所以只会把跳转的页面输出到iframe,而不会让当前页面跳转。
还有一点,callback url要和当前页面同域。跨域的iframe无法调用父页面的内容。
再来看看deal.php,也就是form的action
<?php
// deal upload file
// and get file id, you can pass other params either
header('location:'.$_GET['cb'].'?file_id=123');
这里可以处理文件,然后入库。操作完成后,把文件的id及其他信息都放在url里,最后跳转到这个url。
最后来看看deal_cd.html,也就是刚刚deal.php跳转到的url,这个文件的内容会填充到页面的iframe里。
<script type="text/javascript">
var rs = window.location.search.split('?').slice(1);
window.parent.getIframeVal(rs.toString().split('=').slice(1));
</script>
这里调用了父窗口的getIframeVal方法,这样父页面就获得了文件的id。
--EOF--
转自 :http://blog.leezhong.com/tech/2011/05/06/crossdomain-upload.html
发表评论
-
javascript div 滚动到底部
2013-03-08 22:46 906var div = document.getElementBy ... -
jquery 数组处理
2012-11-29 16:47 779jQuery的数组处理,便捷,功能齐全. 最近 ... -
jQuery 美元符冲突的解决方法,使用jquery与别的js库共同使用的时候需要注意的地方。
2012-06-20 16:49 798jQuery 美元符冲突的解决方法,使用jquery与别的 ... -
jquery事件机制扩展插件,jquery鼠标右键事件。
2012-06-14 19:25 1278因为最近技术长进缓慢,也没高手带,只能靠自己了,所以想仿个 ... -
JavaScript获取HTML页面源代码
2012-06-13 21:50 1328JavaScript获取HTML页面源代码 <a ... -
fancybox
2012-05-07 03:23 835http://www.beautycss.cn/blog/ar ... -
jquery刷新页面
2012-05-04 17:30 1576jquery刷新页面 局部刷新: 这个方法就多了去了,常见 ... -
jquery iframe 操作
2012-03-07 20:11 1716jquery iframe操作 使 ... -
判断是否已经加载过jquery,没有则加载jquery库
2012-01-17 15:27 1828如果一个项目接手的人比较多或者是以前的老项目,大家肯定碰到过用 ... -
jQuery插件—获取URL参数
2011-08-21 16:30 938jQuery插件—获取URL参数 ... -
js 中文编码
2011-04-16 21:38 2023js 中文编码 2009年08月22日 星期六 21:24 ... -
jquery 弹窗 (转)
2011-01-10 19:22 1882jquery 弹窗 (转) 2010-07-13 10:08 ... -
3款 jquery tab
2011-01-09 01:17 6750一、jQuery idTabs idTabs 是 jQuer ... -
jquery 加载图片
2011-01-07 21:48 724<script type="text/java ... -
javascript 获取浏览器高度宽度
2010-09-28 15:13 1020如何我javaScript获取窗口的高度和宽度 ------- ... -
javascript confirm,alert,prompt用法
2010-09-20 14:41 1284window.confirm 参数就只有一个。显示提示 ... -
Javascript 下拉列表多选
2010-08-27 13:10 1401DropDownList 不能多选,要多选,只能用ListBo ... -
javascript 检测是否按下ctrl 或 alt
2010-08-27 13:08 2280if(event.ctrlKey||event.altKey) ... -
兼容ie6,ie7,ff浏览器添加到收藏夹代码
2010-08-22 17:35 1418<a href="javascript:Add ... -
ie8在iframe中找到当前iframe外的节点
2010-06-04 08:01 1512window.parent.document.getElem ...
相关推荐
总的来说,`form+iframe`解决跨域上传文件是一种传统而实用的技巧,尤其适用于不支持AJAX或CORS的老版本浏览器。但随着技术的发展,现代浏览器提供的CORS、Fetch API等机制已经成为更安全、更灵活的选择,建议在条件...
在文件跨域上传场景中,通常由一个源(如用户界面所在的网页)向另一个源(如处理文件上传的服务器API)发送数据。 首先,我们创建一个包含文件上传表单的页面,表单需要设置`target`属性为一个`iframe`的ID,这样...
总结,文件上传和iframe跨域数据提交的关键在于正确构建form表单,合理安排文件选择与提交的时机,以及正确处理iframe中的返回数据。这种方法虽然略显复杂,但在处理跨域提交和文件上传时非常实用,尤其在没有CORS...
最后,为了使Ueditor能够处理跨域上传,还需要在配置文件中开启`customDomain`并设置为`true`: ```javascript customDomain: true, ``` 完成以上步骤后,Ueditor就应该能够通过你自定义的接口进行跨域图片上传了...
以上就是在使用UEditor编辑器时解决跨域上传问题的一些方法。这些方法虽然在不同的浏览器中有所不同,但是核心思想都是通过设置document.domain属性来规避浏览器的同源策略限制。需要注意的是,这种跨域方法虽然方便...
5. **IFrame**: IFrame(内联框架)常用于解决跨域问题,特别是在文件上传时。通过隐藏的IFrame,可以提交表单到不同的域而不违反同源策略。在这个方案中,IFrame可能是用来隐藏文件上传过程,同时处理返回的结果。 ...
在这个"高度自适应跨域访问实例下载"中,我们看到三个HTML文件:iframe.html、agent.html和main.html,它们可能是用于演示如何在不同环境下实现跨域通信和页面适应性。 1. **跨域访问**:在Web浏览器的安全策略下,...
在图片上传场景下,IFrame常用于解决跨域问题和模拟POST提交,因为它可以创建一个独立的上下文环境,使得文件上传操作不会影响到主页面。 以下是实现步骤: 1. 创建一个`<input type="file">`元素,让用户选择需要...
总的来说,跨域异步上传文件涉及到多个技术和策略,包括jQuery.form插件、CORS、JSONP以及IFrame。理解并掌握这些技术是开发现代Web应用所必需的,尤其是在涉及多平台兼容性时。通过合理地运用这些工具和方法,我们...
AjaxUpload是一种基于JavaScript和Ajax技术实现的异步文件上传方式,它允许用户在不刷新整个网页的情况下上传文件,显著提升了用户体验。AjaxUpload的核心是利用XMLHttpRequest对象与服务器进行交互,通过创建隐藏的...
而纯AJAX上传文件存在一个问题,由于浏览器的安全限制,XMLHttpRequest对象无法跨域发送PUT或POST请求,这在文件上传时通常需要用到。因此,利用iframe作为目标可以解决这个问题,因为iframe允许跨域提交。 以下是...
FancyUpload可能使用IFrame或者Flash技术作为后端通信的桥梁,因为这些技术能解决跨域问题并兼容老版本的浏览器。 无刷新上传文件的后端处理通常涉及multipart/form-data编码的处理。当前端使用FormData发送文件时...
"iframe实现无刷新上传下载"是一个利用IFrame和JQuery技术来创建的项目,它允许用户在不刷新整个页面的情况下进行文件的上传和下载操作,提高了交互效率,同时也保持了页面状态的连续性。 首先,我们要理解什么是...
jQuery Iframe Transport是jQuery File Upload的一部分,主要解决大型文件或者需要跨域上传时的问题。由于浏览器的安全策略,某些情况下普通的Ajax上传可能无法工作,这时Iframe Transport通过创建一个隐藏的iframe...
总结来说,通过隐蔽的iframe实现无刷新上传文件操作,可以提供流畅的用户体验。这种方式结合ReactJS、AmazeUI和Node.js,利用iframe的特性以及JavaScript的事件处理机制,能够有效地处理文件上传并在上传完成后更新...
7. **跨域上传**:如果需要在多个域之间进行文件上传,需要处理CORS(跨源资源共享)设置,确保服务器允许从其他域名发送上传请求。 总之,.NET文件上传控件是一个复杂但重要的功能,涉及到前端交互、后端处理、...
在这种情况下,可以使用PHP结合HTML的iframe元素来实现实时上传文件并显示结果。以下是对这个技术的详细解释: ### 1. 什么是iframe? iframe(Inline Frame)是HTML中的一个标签,它允许我们在一个网页内嵌入另一...
它处理了文件上传的复杂性,如创建隐藏IFrame、处理跨域问题等,使得文件上传变得简单。 4. **Ajax**:Asynchronous JavaScript and XML(异步JavaScript和XML)是一种在不刷新整个页面的情况下更新部分网页的技术...