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. POJ2175 Evacuation Plan

    Evacuation Plan Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 4617   Accepted: 1218   ...

  2. 问题记录：JavaFx 鼠标滑轮滚动事件监听！

    问题描述: 在listview的item里面添加鼠标拖拽排序功能.代码如下: setOnMouseDragged(event -> { //设定鼠标长按0.3秒后才可拖拽 防止误操作 isCan ...

  3. 关于SQL的相关笔记【长期更新，只发一帖】

    场景[1]多表联查时,主表与关联表同时与同一张(第三张表)有关联,类似三角恋关系- - 涉及表: HOUSE:记录了房屋信息 ROOMS:记录了房间信息 HOUSE_STATUS:记录了状态信息的中文 ...

  4. easyUI和bootstrap的混搭

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  5. 浅谈Android样式开发之View Animation (视图动画)

    引言 一个用户体验良好的App肯定少不了动画效果.Android为我们提供了2种动画框架,分别是视图动画(View Animation)和属性动画(Property Animation).视图动画比较 ...

  6. 20155324王鸣宇对C语言课程回顾及对Java的展望

    # 第二次预备作业 你有什么技能比大多人(超过90%以上)更好? 针对这个技能的获取你有什么成功的经验? 与老师博客中的学习经验有什么共通之处? 我谦虚的说整个2015级五系英雄联盟这个游戏我最厉害( ...

  7. SSAS 通过 ETL 自动建立分区

    一.动态分区的好处就不说了,随着时间的推移,不可能一个度量值组都放在一个分区中,处理速度非常慢,如何动态添加分区,如何动态处理分区,成为了很多新手BI工程师一个头痛的问题,废话不多说,分享一下我的经验 ...

  8. NDK 笔记（一）

    参考:https://developer.android.com/studio/projects/add-native-code.html#link-gradle 使用Android Studio 2 ...

  9. linux 安装maven

    set maven environment M2_HOME=/tool/apache-maven-3.3.9export M2_HOME  PATH=$PATH:$M2_HOME/bin  expor ...

  10. mysql的enum和set数据类型

    定义一个ENUM或者SET类型,可以约束存入的数值. ENUM中的值必须是定义过数值列中的一个,比如ENUM('a','b','c'),存入的只能是'a'或者'b'或者'c',如果存入'','d'或者 ...