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. [WP8.1开发]RSA 使用BouncyCastle 公钥解密

    写应用的时候遇到个服务器返回私钥加密过的数据 ,然后要在客户端用公钥解密的需求 ,一直没找到方法,应用搁置了一个学期,多方搜索,结论就是.net没有实现公钥解密的方法,要自己实现,于是硬着头皮开始看B ...

  2. ReactNative 分享解决listView的一个郁闷BUG

    用ListView的时候,会出现一个非常傻bi的情况,就是render的时候,listView不显示,需要碰/滑一下才会显示. 一开始我在怀疑自己是不是布局哪里有冲突,改到哭都没发现布局有什么问题,直 ...

  3. JavaScript备忘录

    提取字符串substring(start,end)substr(start [, length ])JavaScript substr() 方法 --

  4. 网页上获取的元素值，为什么类型,string

    <body> <input type="text" value='9'/><input type="text" value='30 ...

  5. 常用的js方法,包括表单校验的一些方法

    /** * 对JSON对象转换为字符串. * @param {json对象} json * @return {json字符串} */ function jsonObj2Str(json) { var ...

  6. 数据结构之平衡查找树(AVL)

    AVL树的旋转操作 图解 最详细 各大教课书上讲的都是左旋与右旋,其实这样很容易理解错误,我们换一种叫法.我们称呼左旋为:逆进针旋转.我们称呼右旋为:顺进针旋转.

  7. HTML5的浏览器支持方案

    现代的浏览器基本都支持 HTML5,此外还有老浏览器. 不管是旧的还是最新的,HTML5对无法识别的元素会作为内联元素自动处理. 所以,在这里教大家怎么让浏览器去处理"未知"的HT ...

  8. nginx_https

    nginx使用ssl模块配置HTTPS支持   默认情况下ssl模块并未被安装,如果要使用该模块则需要在编译时指定–with-http_ssl_module参数,安装模块依赖于OpenSSL库和一些引 ...

  9. 商业智能BI

    参考资料: 7 款顶级开源 BI(商务智能)软件和报表工具

  10. Alpha阶段项目总结

    1.我们的软件要解决什么问题?是否定义得很清楚?是否对典型用户和典型场景有清晰的描述? 我们的软件是一款面向高校学生的简单快速的云笔记,不仅具有笔记的添加.修改.查看和删除功能,还有笔记公开功能,用户 ...