iframe无刷新跨域并获得返回值
参考:http://geeksun.iteye.com/blog/1070607
/**
* iframe跨域提交大数据
* @param action 跨域地址
* @param arr [
{name:'loginName',value:'liuxw'},
{name:'password',value:'123456'}
]
* @param callUrl 服务器重定向该url指向画面。(callUrl所指向画面与IframCall函数调用画面在同一域名下)
*/
function IframCall(formName,action,arr,callUrl){
var _html='<form action="'+action+'" id="'+formName+'" name="'+formName+'" method="post" target="_hidden_frame" >' ;
for(var ii in arr) {
_html += '<input name="' + arr[ii].name + '" value="' + arr[ii].value + '" />';
}
//追加跨域回调url,服务器处理完请求后,直接重定向到该url所指向画面。
//url所指向画面与当前画面处于同一域名下。
_html += '<input name="callUrl" value="'+callUrl+'" />';
_html+='<iframe name="_hidden_frame" id="_hidden_frame" style="display:none"></iframe>';
_html+='</form>';
//表单追加到body元素
document.body.appendChild(_html);
//提交表单
document.getElementsByName(formName).submit();
}
//该函数定义在父画面(iframe里的画面称子画面)
function callback(result){
alert(result);
}
##调用IframCall(formName,action,arr,callUrl)提交表单到服务器。
##假设callUrl指向deal_callBack.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>跨域回调处理</title>
</head>
<body>
<script type="text/javascript">
//服务器重定向到本页面后
window.onload=function(){
//接收回传参数进行处理,
var rs = window.location.search.split('?').slice(1);
var result=rs.toString().split('=').slice(1);
//回调父画面函数callBack(iframe里的画面称子画面)
window.parent.callback(decodeURI(result));
};
</script>
</body>
</html>
#服务器处理跨域请求,示例
/**
* 保存作业
*/
@RequestMapping("saveWork")
@ResponseBody
public void uploadWorkImg(HttpServletRequest request, HttpServletResponse response,
@RequestParam(value="imgStr",required = true) String imgSrc,
@RequestParam(value="workName",required = true) String workName,
@RequestParam(value="pageId",required = true) String pageId,
@RequestParam(value="chapterId",required = true) String chapterId,
@RequestParam(value="userId",required = true) String userId,
@RequestParam(value="opeartor",required = false) String opeartor,
@RequestParam(value = "callUrl",required = true) String callUrl)
throws IOException {
response.setContentType("text/html");
response.setCharacterEncoding("utf-8");
String result = "";
Date dt = new Date();
// base64解码
byte[] b = null;
sun.misc.BASE64Decoder decoder = new sun.misc.BASE64Decoder();
b = decoder.decodeBuffer(imgSrc);
for (int i = 0; i < b.length; ++i) {
if (b[i] < 0) {// 调整异常数据
b[i] += 256;
}
}
//图片文件流上传至服务器
InputStream ins = new ByteArrayInputStream(b);
//save File
String resPath=PropertiesUtils.getString("ecourse_fs_path");
String extFilename = "png";
String saveFilename=(new RandomGUID()).toString()+"."+extFilename;
//save path md(1-2)/md(3-4)/md5
String saveDir =saveFilename.substring(0,2)+"/"+saveFilename.substring(2,4)+"/";
String fullpathname=resPath+saveDir+saveFilename;
logger.info("fullpathname:"+fullpathname);
FileUtils.copyInputStreamToFile(ins, new File(fullpathname));
logger.info("--uploadTest end--");
//保存
WorkInfo workInfo = new WorkInfo();
workInfo.setWorkName(workName);
workInfo.setImgSrc(saveFilename);
workInfo.setPageId(Integer.parseInt(pageId));
workInfo.setChapterId(Integer.parseInt(chapterId));
workInfo.setCreateDatetime(dt);
workInfo.setCreateOperator(opeartor);
workInfo.setUserId(Integer.parseInt(userId));
ServiceResult<Boolean> serviceResult = myWorkApi.addWork(workInfo);
if (!serviceResult.isOk()) {
result = "保存失败!";
} else {
result = "保存成功!";
}
// callUrl为回调url,result为回传参数
response.addHeader("Location", callUrl + "?result=" + URLEncoder.encode(result, "utf-8"));
response.sendRedirect(callUrl + "?result=" + URLEncoder.encode(result, "utf-8"));
}
iframe无刷新跨域并获得返回值的更多相关文章
- iframe无刷新跨域上传文件并获取返回值
通常我们会有一个统一的上传接口,这个接口会被其他的服务调用.如果出现不同域,还需要无刷新上传文件,并且获取返回值,这就有点麻烦了.比如,新浪微博启用了新域名www.weibo.com,但接口还是使用原 ...
- iframe无刷新跨域上传文件并获得返回值
原文:http://geeksun.iteye.com/blog/1070607 需求:从S平台上传文件到R平台,上传成功后R平台返回给S平台一个值,S平台是在一个页面弹出的浮窗里上传文件,所以不能用 ...
- 小米手机跨域问题,返回resphone:undefined,status 0
小米手机跨域问题,返回resphone:undefined,status 0我小米note2的手机登录不上,返回resphone:undefined,status 0 我手机登录不了的问题解决了,后台 ...
- 黄聪:利用iframe实现ajax 跨域通信的解决方案(转)
原文:http://www.cnblogs.com/xueming/archive/2013/02/01/crossdomainajax.html 在漫长的前端开发旅途上,无可避免的会接触到ajax, ...
- 使用 iframe + postMessage 实现跨域通信
在实际项目开发中可能会碰到在 a.com 页面中嵌套 b.com 页面,这时第一反应是使用 iframe,但是产品又提出在 a.com 中操作,b.com 中进行显示,或者相反. 1.postMess ...
- iframe嵌套页面 跨域
父级调用iframe方法: document.getElementById("iframe").contentWindow.func(data1,data2...) 子级 ifra ...
- ajax +jsp+iframe无刷新上传文件[转]
http://hi.baidu.com/zj360202/blog/item/f23e3711f929c774cb80c475.html ajax jsp 无刷新上传文件 2009-10-26 16: ...
- Html使用Iframe无刷新上传文件,后台接收
html代码:我是发送请求到teacher_center.aspx,不是到.ashx一般处理程序里,需要加 runat="server",有空我再试试发送请求到 .ashx 里 & ...
- SpringBoot22 Ajax跨域、SpringBoot返回JSONP、CSRF、CORS
1 扫盲知识 1.1 Ajax为什么存在跨域问题 因为浏览器处于安全性的考虑不允许JS执行跨域请求. 1.2 浏览器为什么要限制JS的跨域访问 如果浏览器允许JS的跨域请求就很容易造成 CSRF (C ...
随机推荐
- 解决:MIUI 8应用商店下载不了软件 APP
MIUI 8应用商店下载不了软件,是什么原因呢? 原因是:刷了国际版的MIUI,然后又刷回国内的MIUI,刷机时数据没有清理干净. 解决办法:使用RE管理器或者其他第三方可以编辑系统文件的文件管理器, ...
- iOS10遇到有推送的Demo真机报错的解决
1.打开project.pbxproj,搜com.apple.Push 改成enabled = 0(在projectName.xcodeproj文件上右键"显示包内容",用文本编辑 ...
- NodeJS:Error: Cannot find module 'jshint/src/cli'
以前命令:npm install gulp-jshint --save-dev 实质上是安装jshint失败,缺少该模块. 更换命令 :npm install --save-dev jshint gu ...
- windows下 nvm下载node被墙了解决办法
不需要这么麻烦的,在1.1.1版本中,确实没有实现命令行设置.这点你分析的很对,但是从配置文件中读取镜像地址已经完成,所以直接在settings.txt中手工设置一下就好了,无需编译.以下是我的文件位 ...
- Spring-IOC-BeanFactory
BeanFactory BeanFactory 是 Spring 的“心脏”.它就是 Spring IoC 容器的真面目.Spring 使用 BeanFactory 来实例化.配置和管理 Bean.但 ...
- oracle---触发器总结
一.触发器简介 触发器的定义就是说某个条件成立的时候,触发器里面所定义的语句就会被自动的执行.因此触发器不需要人为的去调用,也不能调用.然后,触发器的触发条件其实在你定义的时候就已经设定好了.这里面需 ...
- Simple Network Management Protocol - SNMP Tutorial
30.9 Simple Network Management Protocol Network management protocols specify communication between t ...
- Java编程思想重点笔记(Java开发必看)
Java编程思想重点笔记(Java开发必看) Java编程思想,Java学习必读经典,不管是初学者还是大牛都值得一读,这里总结书中的重点知识,这些知识不仅经常出现在各大知名公司的笔试面试过程中,而 ...
- .Net 中的反射(动态创建类型实例) - Part.4
动态创建对象 在前面节中,我们先了解了反射,然后利用反射查看了类型信息,并学习了如何创建自定义特性,并利用反射来遍历它.可以说,前面三节,我们学习的都是反射是什么,在接下来的章节中,我们将学习反射可以 ...
- php多进程总结
本文部分来自网络参考,部分自己总结,由于一直保存在笔记中,并没有记录参考文章地址,如有侵权请通知删除.最近快被业务整疯了,这个等抽时间还需要好好的整理一番. 多进程--fork 场景:日常任务中, ...