由于同源策略的限制，XMLHttpRequest只允许请求当前源（包含域名、协议、端口）的资源。

json与jsonp的区别：
    JSON是一种数据交换格式，而JSONP是一种依靠开发人员创造出的一种非官方跨域数据交互协议。

script标签经常被用来加载不同域下的资源，可以绕过同源策略。（有src属性的都可以获取异域文件）。
如果请求的这个远程数据本身就是一段可执行的js，那么这些js会被执行（相当于eval）。
    
方法一：
利用script标签请求（<script src="http://....jsp?callback=回调函数名"></script>）
在使用script标签请求前，先进行回调函数的申明调用，
    <script>
        function 回调函数名（data数据）{   。。。。 }
    </script>
    <script src="http://....jsp?callback=回调函数名"></script>

使用JSON来传递javascript对象是一种最简单的方式了，这样的跨域通讯方式称为JSONP。
    
    远程服务器拼凑字符串：
        回调函数名( {"name1":"data1","name2","data2"} )
    这种以后台拼凑json数据，利用回调函数传参的形式返回给客户端
    （可以直接调用相当于已经将获取的字符串进行eval了处理）
    例如：function databack(data){ alert(data.name1) }  // 会输出显示"data1"

方法二：
jquery实现异域加载方法更为简单(与ajax异步请求方式相同）
    $.ajax({
        type : "get",
        dataType:"json",
        success : function(data){ alert(data.name1) };
    })
    或者简写形式
    var url = "http://.....jsp?callback=?"; // 在jquery中此处的callback值可以为任意，因为

jquery进行处理后都是利用success回调函数进行数据的接受；
    $.getJSON( url, function(data){ alert(data.name1) });

方法三：
ajax跨域之服务端代理
    在同源的后台设置一个代理程序（proxy.jsp...）;在服务器端与异域的服务器交互。
    
    jquery前台传输数据：
        例如：
    　　$.get(
      　　  'http://。。。.jsp',    // 代理程序地址
      　　  {
       　　     name1 : "data1",
       　　     name2 : "data2"
       　　 },
     　　   function(data){
    　　    if(data == 1) alert('发送成功！');
       　　 }
  　　  );
    
    后台数据的处理 :
        String data1 = request.getParameter("name1");
        ........
        // 此处的url为另一域下的地址并带有参数
        String url = "http://.....com/.../sss.jsp?" +　"name1=" + data1+　"name2=" +

data2;
        // 跳转到另一个域进行数据的处理并返回json格式的数据
        request.getRequestDispatcher(url).forward(request,response);

方法四：
    利用iframe标签的src属性，进行跨域的访问，将获取到的值存储到当前的iframe中，然后再

同一页面进行获取该iframe的body内的值。
    <body>
        <div id="show"></div>
        <iframe id="frame" style="display: none;"></iframe>
    </body>
    <script>
$("#frame").attr("src", "路径?time=" + new Date().getTime()).load(function(){
    // 获取iframe标签的值并进行获取，显示到页面
    $("#show").append("[data: " + $($("#frame").get(0).contentDocument).find("body").text()

+ " ]");
});
    </script>

方法五：
    HTML5中websocket可以进行跨域的访问;
　　创建一个websocket对象：

　　　　var ws = new WebSocket(url);

　　主要处理的事件类型有（onopen,onclose,onmessage,onerror）;

　　　　例如：

　　　　ws.onopen = function(){

　　　　　　console.log("open")；

　　　　　　// 向后台发送数据

　　　　　　ws.send("open");

　　　　}

　　　　后台可以是java,php,nodejs等，对数据处理用时间onmessage事件对返回的值进行前端处理。

　　　　ws.onmessage = function(eve){

　　　　　　console.log(eve.data);

　　　　}

　　

js实现跨域的方法的更多相关文章

  1. JS访问或设置cookie的方法+跨域调用方法

    无意中从163网站获取的JS访问或设置cookie的方法,Log到日志上以防遗忘 //COOKIE功能检查function fCheckCookie(){    if(!navigator.cooki ...

  2. js调用跨域

    web aapi 初体验 解决js调用跨域问题   跨域界定 常见跨域: 同IP不同端口: http:IP:8001/api/user     http:IP:8002/api/user 不同IP不同 ...

  3. js&jquery跨域详解jsonp，jquery并发大量请求丢失回调bug

    URL  说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js http:/ ...

  4. [转]vue跨域解决方法

      vue跨域解决方法 vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' hea ...

  5. AJAX四种跨域处理方法

    同源策略 同源策略 同源策略限制从一个源加载的文档或者脚本如何与来自另一个源的资源进行交互.这是一个用于隔离潜在恶意文件的关键的安全机制. 具体定义是:一段脚本向后台请求数据,只能读取属于同一协议名. ...

  6. JS JSOP跨域请求实例详解

    JSONP(JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题.这篇文章主要介绍了JS JSOP跨域请求实例详解的相关资料,需要的朋友可以参考下 ...

  7. 搞懂：前端跨域问题JS解决跨域问题VUE代理解决跨域问题原理

    什么是跨域 跨域:一个域下的文档或脚本试图去请求另一个域下的资源 广义的跨域包含一下内容: 1.资源跳转(链接跳转,重定向跳转,表单提交) 2.资源请求(内部的引用,脚本script,图片img,fr ...

  8. js执行跨域请求

    //js执行跨域请求 var _script = document.createElement('script'); _script.type = "text/javascript" ...

  9. react-native debug js remotely跨域问题

    react-native debug js remotely跨域问题 我们在安卓真机上调试react-native时,启用debug js remotely的时候,会出现跨域问题.这个时候我们只需要一 ...

随机推荐

  1. CSS animation-timing-function 属性中的 steps() 与 step-start，step-end

    steps() 设置间隔参数,可以实现分步过渡 第一个参数指定了时间函数中的间隔数量(必须是正整数)第二个参数可选,接受 start 和 end 两个值,指定在每个间隔的起点或是终点发生阶跃变化,默认 ...

  2. for、while循环(java基础知识四)

    1.循环结构概述和for语句的格式及其使用 * 什么是循环结构 循环语句可以在满足循环条件的情况下,反复执行某一段代码,这段被重复执行的代码被称为循环体语句,当反复执行这个循环体时,需要在合适的时候把 ...

  3. boost之timer

    1. timer类实现 #pragma once #include <ctime> #include <limits> class timer { public: timer( ...

  4. ASP.NET Core：目录

    ylbtech-ASP.NET Core:目录 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   作者:ylbtech出处:http:// ...

  5. Codechef QGRID

    QGRID code 给定一个 n × m(1 <= m <= 3) 的点网格,网格的边上以及点上都有权值.初始时所有点的权值都为 0 .维护两种操作:1. x1 y1 x2 y2 c 把 ...

  6. this关键字在继承中的使用

    参考:http://blog.csdn.net/gxzzxj/article/details/51946144 下面是自己的代码: public class ChildA extends Father ...

  7. python学习笔记5-自定义函数

    1 自定义函数  (1)函数代码块以def关键字开头,然后函数标识符名称和圆括号  (2)任何传入参数和自变量必须放在圆括号中间.圆括号之间可以用于定义参数  (3)函数的第一行语句可以选择性的使用文 ...

  8. html行内要素与块级要素

    行内要素:在一行里,不可设置width和height,不能上下外铺(margin) span 块状要素,标准的 div

  9. git中文件的三种状态

    用xcode的时候,左侧栏文件的邮右边时不时会看到M,A这一类的字母.当然,这些以后再写上.先说一下git里文件的三种状态 已提交(committed)  已经提交的本地仓库(repository), ...

  10. ARC和MRC混合使用

    在一些项目中尤其是做迭代的项目经常会出现MRC的项目,但是我们习惯了ARC环境,反之也是一样.这是我们不必去修改代码去掉release之类的,按照如下方案去做就可以了. 项目 -> Build ...