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跨域提交数据的更多相关文章

  1. 代替jquery $.post 跨域提交数据的N种形式

    跨域的N种形式: 1.直接用jquery中$.getJSON进行跨域提交 优点:有返回值,可直接跨域: 缺点:数据量小: 提交方式:仅get (无$.postJSON) $.getJSON(" ...

  2. ajax 跨域提交数据

    $.ajax({ url:"http://my.demo.com/jsonp/server.php",//不同域的文件; cache: false, //是否使用缓存; error ...

  3. html Js跨域提交数据方法,跨域提交数据后台获取不到数据

    MVC实现方式:(后台获取不到方法请参考下面js) [ActionAllowOrigin][HttpPost]public JsonResult Cooperation() { return json ...

  4. CORS 跨域 node |XMLHttpRequest 跨域提交数据 node

    node服务端 app.post('/getdata',function(req,res,next){ req.setEncoding('utf8'); res.setHeader('Access-C ...

  5. 使用jQuery实现跨域提交表单数据

    我们在WEB开发中有时会遇到这种情况,比如要从A网站收集用户信息,提交给B网站处理,这个时候就会涉及到跨域提交数据的问题.本文将给您介绍如何使用jQuery来实现异步跨域提交表单数据.   在jQue ...

  6. jquery来跨域提交表单

    说说用jquery来实现跨域提交表单 在jQuery中,我们使用json数据类型,通过getJSON方法来实现从服务端获取或发送数据,而当要向不同远程服务器端提交或者获取数据时,要采用jsonp数据类 ...

  7. Ajax 跨域提交表单

    跨域提交表单,前端ajax不用做任何修改, 只需要在后端调用的方法里面添加一行代码即可. .NET 版 HttpContext.Response.AddHeader("Access-Cont ...

  8. 使用iframe实现同域跨站提交数据

    有一个已经编译的asp.net 1.1的网站.为了改进录入的效率,改为由barcode扫描枪来替代手动.由于在扫描枪添加其它信息.原录入窗口已经无法适应.另外程序虽然跑的是存储过程,但交易的trans ...

  9. JavaScript 跨域漫游

    前言: 最近在公司做了几个项目都涉及到了iframe,也就是在这些iframe多次嵌套的项目中,我发现之前对iframe的认识还是比较不足的,所以就静下心来,好好整理总结了iframe的相关知识:&l ...

随机推荐

  1. 使用Navicat在oracle XE上新建表空间、用户及权限赋予

    参考资料: 烂泥:使用Navicat for Oracle新建表空间.用户及权限赋予 - 烂泥行天下 - 51CTO技术博客http://ilanni.blog.51cto.com/526870/12 ...

  2. BZOJ2117: [2010国家集训队]Crash的旅游计划

    裸点分,点分树每层维护有序表,查询二分,复杂度$O(nlog^3n)$. #include<bits/stdc++.h> #define M (u+v>>1) #define ...

  3. C#之类的使用

    属性与字段的使用类似iOS class Class1 { //字段私有,属性公有 private string _name; private int _age; /*control + r -> ...

  4. nginx-1.8.0 rpm包制作

    1.安装rpm-build # yum install rpm-build 2.创建制作RPM包目录 # cat /root/.rpmmacros %_topdir /root/rpmbuild %_ ...

  5. RabbitMQ学习系列(四): 几种Exchange 模式

    上一篇,讲了RabbitMQ的具体用法,可以看看这篇文章:RabbitMQ学习系列(三): C# 如何使用 RabbitMQ.今天说些理论的东西,Exchange 的几种模式. AMQP协议中的核心思 ...

  6. Event Loop个人理解

    javascript引擎单线程程序,其执行同步操作会按顺序向下执行,执行异步操作则使用事件循环模型. js引擎线程遇到异步操作,会将异步操作交给对应的观察者, 异步操作包括: dom事件 click, ...

  7. Eclipse部署Maven web项目到tomcat服务器时,没有将lib下的jar复制过去的解决办法

    我们在做web开发是,经常都要在eclipse中搭建web服务器,并将开发中的web项目部署到web服务器进行调试,在此,我选择的是tomcat服务器.之前部署web项目到tomcat进行启动调试都很 ...

  8. ELK 集中日志分析 windows部署实战

    一步步来 1.下载软件 Elasticsearch: https://download.elasticsearch.org/...p/elasticsearch/2.0.0/elasticsearch ...

  9. iOS面试题

    一个区分度很大的面试题 考察一个面试者基础咋样,基本上问一个 @property 就够了: @property 后面可以有哪些修饰符? 线程安全的: atomic,nonatomic 访问权限的 re ...

  10. codevs1257 打砖块

    题目描述 Description 在一个凹槽中放置了n层砖块,最上面的一层有n块砖,第二层有n-1块,--最下面一层仅有一块砖.第i层的砖块从左至右编号为1,2,--i,第i层的第j块砖有一个价值a[ ...