JavaScript跨域提交数据
1.通过jsonp跨域
场景:假设前台有JS方法"crossJS",
1.1发送请求http://www.xxx.com/?callback=crossJS。(创建一个script标签,请求该地址)
1.2后台服务器,返回数据格如crossJS({"a":"b"});
优点:开发、维护简单
缺点:每次可提交数据大小受get方式限制
2.使用HTML5中新引进的window.postMessage方法来跨域传送数据
场景:
页面http://www.aaa.com/A.html:
<html>
<body>
<input type="text" id="txt"/>
<button onclick="fnSend()">发送</button>
<iframe id="ifr" src="http://192.168.127.39:82/b.html"></iframe>
</body>
<script type="text/javascript">
function fnSend(){
var ifr = document.getElementById("ifr");
var win = ifr.contentWindow;
var txt = document.getElementById("txt");
win.postMessage('{"msg":"' + txt.value + '"}',"http://192.168.127.39:82");
}
</script>
</html>
页面http://www.bbb.com/B.html:
B页面,接收结果
<ul id="msg"></ul>
<script type="text/javascript">
window.onmessage = function(msg){
msg = msg.data||{};
console.log(msg);
msg = JSON.parse(msg); var ul = document.getElementById("msg");
var li = document.createElement("li");;
li.innerHTML = msg.msg;
ul.appendChild(li);
}
</script>
优点:可以提交数据量大。
缺点:1.页面http://www.aaa.com/A.html,不可以直接提交数据到http://www.bbb.com/站点服务器,只能通过http://www.bbb.com/B.html页面中转
2.维护麻烦,需要两个站点的页面都同时修改。
3.使用Flush方法来跨域传送数据
转载 http://zyan.cc/ajaxcdr/#entrymore
详情见demo: http://files.cnblogs.com/files/you000/ajaxcdr-1.0.zip
JavaScript跨域提交数据的更多相关文章
- 代替jquery $.post 跨域提交数据的N种形式
跨域的N种形式: 1.直接用jquery中$.getJSON进行跨域提交 优点:有返回值,可直接跨域: 缺点:数据量小: 提交方式:仅get (无$.postJSON) $.getJSON(" ...
- ajax 跨域提交数据
$.ajax({ url:"http://my.demo.com/jsonp/server.php",//不同域的文件; cache: false, //是否使用缓存; error ...
- html Js跨域提交数据方法,跨域提交数据后台获取不到数据
MVC实现方式:(后台获取不到方法请参考下面js) [ActionAllowOrigin][HttpPost]public JsonResult Cooperation() { return json ...
- CORS 跨域 node |XMLHttpRequest 跨域提交数据 node
node服务端 app.post('/getdata',function(req,res,next){ req.setEncoding('utf8'); res.setHeader('Access-C ...
- 使用jQuery实现跨域提交表单数据
我们在WEB开发中有时会遇到这种情况,比如要从A网站收集用户信息,提交给B网站处理,这个时候就会涉及到跨域提交数据的问题.本文将给您介绍如何使用jQuery来实现异步跨域提交表单数据. 在jQue ...
- jquery来跨域提交表单
说说用jquery来实现跨域提交表单 在jQuery中,我们使用json数据类型,通过getJSON方法来实现从服务端获取或发送数据,而当要向不同远程服务器端提交或者获取数据时,要采用jsonp数据类 ...
- Ajax 跨域提交表单
跨域提交表单,前端ajax不用做任何修改, 只需要在后端调用的方法里面添加一行代码即可. .NET 版 HttpContext.Response.AddHeader("Access-Cont ...
- 使用iframe实现同域跨站提交数据
有一个已经编译的asp.net 1.1的网站.为了改进录入的效率,改为由barcode扫描枪来替代手动.由于在扫描枪添加其它信息.原录入窗口已经无法适应.另外程序虽然跑的是存储过程,但交易的trans ...
- JavaScript 跨域漫游
前言: 最近在公司做了几个项目都涉及到了iframe,也就是在这些iframe多次嵌套的项目中,我发现之前对iframe的认识还是比较不足的,所以就静下心来,好好整理总结了iframe的相关知识:&l ...
随机推荐
- 使用Navicat在oracle XE上新建表空间、用户及权限赋予
参考资料: 烂泥:使用Navicat for Oracle新建表空间.用户及权限赋予 - 烂泥行天下 - 51CTO技术博客http://ilanni.blog.51cto.com/526870/12 ...
- BZOJ2117: [2010国家集训队]Crash的旅游计划
裸点分,点分树每层维护有序表,查询二分,复杂度$O(nlog^3n)$. #include<bits/stdc++.h> #define M (u+v>>1) #define ...
- C#之类的使用
属性与字段的使用类似iOS class Class1 { //字段私有,属性公有 private string _name; private int _age; /*control + r -> ...
- nginx-1.8.0 rpm包制作
1.安装rpm-build # yum install rpm-build 2.创建制作RPM包目录 # cat /root/.rpmmacros %_topdir /root/rpmbuild %_ ...
- RabbitMQ学习系列(四): 几种Exchange 模式
上一篇,讲了RabbitMQ的具体用法,可以看看这篇文章:RabbitMQ学习系列(三): C# 如何使用 RabbitMQ.今天说些理论的东西,Exchange 的几种模式. AMQP协议中的核心思 ...
- Event Loop个人理解
javascript引擎单线程程序,其执行同步操作会按顺序向下执行,执行异步操作则使用事件循环模型. js引擎线程遇到异步操作,会将异步操作交给对应的观察者, 异步操作包括: dom事件 click, ...
- Eclipse部署Maven web项目到tomcat服务器时,没有将lib下的jar复制过去的解决办法
我们在做web开发是,经常都要在eclipse中搭建web服务器,并将开发中的web项目部署到web服务器进行调试,在此,我选择的是tomcat服务器.之前部署web项目到tomcat进行启动调试都很 ...
- ELK 集中日志分析 windows部署实战
一步步来 1.下载软件 Elasticsearch: https://download.elasticsearch.org/...p/elasticsearch/2.0.0/elasticsearch ...
- iOS面试题
一个区分度很大的面试题 考察一个面试者基础咋样,基本上问一个 @property 就够了: @property 后面可以有哪些修饰符? 线程安全的: atomic,nonatomic 访问权限的 re ...
- codevs1257 打砖块
题目描述 Description 在一个凹槽中放置了n层砖块,最上面的一层有n块砖,第二层有n-1块,--最下面一层仅有一块砖.第i层的砖块从左至右编号为1,2,--i,第i层的第j块砖有一个价值a[ ...