Firebug: 已拦截跨源请求：同源策略禁止读取位于XXX的远程资源。（缘由：CORS 头缺乏 'Access-Control-Allow-

第一种，就是在被请求的程序中添加HTTP头，即CORS跨域（跨域资源共享，Cross-Origin Resource Sharing）

如： Response.Headers.Add("Access-Control-Allow-Origin", "*"); // JSON { 'Access-Control-Allow-Origin': '*', } // HTML <meta http-equiv="Access-Control-Allow-Origin" content="*"> // PHP header("Access-Control-Allow-Origin: *"); header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

 

　　添加此段代码的目的很简单，也就是告诉浏览器，这个资源是运行远程全部域名访问的。固然，此处的也能够替换为指定的域名，出于安全考虑，建议将替换成指定的域名。 
　　因为IE10如下浏览器不支持CORS，因此目前在国内CORS并非主流的跨域解决方案，可是随着windows 10的发布，IE的逐渐衰落，能够预见，在不远的未来CORS将成为跨域的标准解决方案。

第二种，就是在被请求的服务器上，添加HTTP响应头。在这里，咱们就以IIS6.0为例：

//在被请求的网站上，设置HTTP头，添加 "Access-Control-Allow-Origin:*" //值为*或指定的域名。

 

第三种，就是在被请求的服务器上在被请求的项目根目录（root下）下放如下文件 ： 
crossdomain.xml

<?xml version="1.0"?> <!DOCTYPE cross-domain-policy SYSTEM "./cross-domain-policy.dtd"> <cross-domain-policy> <site-control permitted-cross-domain-policies="all" /> <allow-access-from domain="*" /> <allow-http-request-headers-from domain="*" headers="*"/> </cross-domain-policy> 

 

cross-domain-policy.dtd

<?xml version="1.0" encoding="ISO-8859-1"?> <!-- Adobe DTD for cross-domain policy files --> <!-- Copyright (c) 2008-2009, Adobe Systems Inc. --> <!ELEMENT cross-domain-policy (site-control?,allow-access-from*,allow-http-request-headers-from*,allow-access-from-identity*)> <!ELEMENT site-control EMPTY> <!ATTLIST site-control permitted-cross-domain-policies (all|by-content-type|by-ftp-filename|master-only|none) #REQUIRED> <!ELEMENT allow-access-from EMPTY> <!ATTLIST allow-access-from domain CDATA #REQUIRED> <!ATTLIST allow-access-from to-ports CDATA #IMPLIED> <!ATTLIST allow-access-from secure (true|false) "true"> <!ELEMENT allow-http-request-headers-from EMPTY> <!ATTLIST allow-http-request-headers-from domain CDATA #REQUIRED> <!ATTLIST allow-http-request-headers-from headers CDATA #REQUIRED> <!ATTLIST allow-http-request-headers-from secure (true|false) "true"> <!ELEMENT allow-access-from-identity (signatory)> <!ELEMENT signatory (certificate)> <!ELEMENT certificate EMPTY> <!ATTLIST certificate fingerprint CDATA #REQUIRED> <!ATTLIST certificate fingerprint-algorithm CDATA #REQUIRED> <!-- End of file. --> 

 

 

第四种，使用JSONP格式 
即在jQuery中ajax请求参数dataType:’JSONP’：

<script> $.ajax({ url:"http://map.oicqzone.com/gpsApi.php?lat=22.502412986242&lng=113.93832783228", type:'GET', dataType:'JSONP', // 处理Ajax跨域问题 success: function(data){ $('body').append( "Name: " + data ); } }); </script>

 

或者：

<script type="text/javascript"> function jsonpCallback(result){ alert(result[1].name); } </script> <script type="text/javascript"src="http://localhost:8080/Jsonp/jsonp.jsp?callback=jsonpCallback"></script> 

 

或者jquery代码：

<script type="text/javascript"> $.getJSON("http://localhost:8080/Jsonp/jsonp.jsp?callback=?", function(json){ alert(json[0].name); }); </script> 

 

后台jsonp.jsp代码：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String callback = request.getParameter("callback"); out.print(callback+"([ { name:'John',age:'19'},{ name:'joe',age:'20'}] );"); out.print(callback); %> 

 

 

或者servlet

import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletConfig; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; @WebServlet("/Jsonp") public class Jsonp extends HttpServlet { protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost(request,response); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String jsonp=request.getParameter("jsonpcallback"); response.setContentType("text/html;charset=UTF-8"); response.setCharacterEncoding("UTF-8"); PrintWriter out = response.getWriter(); out.write(jsonp + "0;null"); out.close(); } @Override public void init(ServletConfig config) throws ServletException { super.init(config); } } 

 

ajax请求的参数：jsonp

类型：String 
在一个 jsonp 请求中重写回调函数的名字。这个值用来替代在 “callback=?” 这种 GET 或 POST 请求中 URL 参数里的 “callback” 部分，好比 {jsonp:’onJsonPLoad’} 会致使将 “onJsonPLoad=?” 传给服务器。

ajax请求的参数：jsonpCallback

类型：String 
为 jsonp 请求指定一个回调函数名。这个值将用来取代 jQuery 自动生成的随机函数名。这主要用来让 jQuery 生成度独特的函数名，这样管理请求更容易，也能方便地提供回调函数和错误处理。你也能够在想让浏览器缓存 GET 请求的时候，指定这个回调函数名。

注意内容： 
　　一、Ajax请求须要设置请求类型为Jsonp 
　　dataType: “jsonp”

　　二、Ajax请求须要设置回调函数，当前函数值必须与服务器响应包含的callback名称相同 
　　jsonpCallback:”fn”

　　三、Ajax请求能够设置jsonp（可选），传递给请求处理程序或页面，用以得到jsonp回调函数名的参数名，默认为:callback 
　　jsonp: “callback”

　　四、服务端返回Json数据必须使用jsonpCallback设置的值进行包裹 
　　return “fn(“+JsonUtil.objectToJson(outPut)+”)” 
　　 
第五种，使用Html5中新引进的window.postMessage方法来跨域传送数据

CORS与JSONP相比，更为先进、方便和可靠。

　　一、 JSONP只能实现GET请求，而CORS支持全部类型的HTTP请求。 
　　 
　　二、 使用CORS，开发者可使用普通的XMLHttpRequest发起请求和得到数据，比起JSONP有更好的错误处理。 
　　 
　　三、 JSONP主要被老的浏览器支持，它们每每不支持CORS，而绝大多数现代浏览器都已经支持了CORS。 
　　 
　　对一个简单的请求，没有自定义头部，要么使用GET，要么使用POST，它的主体是text/plain,请求用一个名叫Orgin的额外的头部发送。Origin头部包含请求页面的头部（协议，域名，端口），这样服务器能够很容易的决定它是否应该提供响应。 
　　服务器端对于CORS的支持，主要就是经过设置Access-Control-Allow-Origin来进行的。 
　　Header set Access-Control-Allow-Origin * 
　　为了防止XSS攻击咱们的服务器， 咱们能够限制域，好比: Access-Control-Allow-Origin: http://blog.csdn.net 
　　不少服务都已经提供了CORS支持，好比 AWS 支持跨域资源分享功能CORS，向S3上传不须要代理。

 

 

上线后最好把 Access-Control-Allow-Origin: * 的 * 改成容许访问的特定域名

header('Access-Control-Allow-Origin:*'); header('Access-Control-Allow-Methods:HEAD,GET,POST,OPTIONS,PATCH,PUT,DELETE'); header('Access-Control-Allow-Headers:Origin,X-Requested-With,Authorization,Content-Type,Accept,Z-Key')

转自：https://blog.csdn.net/xlxxcc/article/details/54588571