下载文档原格式
HTTP跨域HTTP状态码HTTP请求方式CS和BS模式一、HTTP跨域因为同源策略的限制，当一个网页需要请求不同域名下的资源时（如发送Ajax请求获取数据），就会触发跨域问题。
浏览器会拒绝这类跨域请求，以避免潜在的安全风险。
为了解决跨域问题，常见的解决办法有以下几种：2. CORS（跨源资源共享）：服务端在响应头中添加特定的`Access-Control-*`字段，用来告诉浏览器该资源可以被访问。
3.代理服务器：在服务器端设置一个代理接口，通过代理服务器来请求跨域的资源，然后再将结果返回给前端。
二、HTTP状态码HTTP状态码用于表示客户端请求的处理结果，它是服务器对客户端请求的响应的标识。
常见的HTTP状态码有以下几类：1. 1xx（信息类）：表示请求已经被接收，需要继续处理。
2. 2xx（成功类）：表示请求已经成功被服务器接收、理解、并成功处理。
-200OK：表示请求成功，并返回所请求的数据。
3. 3xx（重定向类）：表示客户端需要采取进一步的操作才能完成请求。
- 301 Moved Permanently：永久重定向，表示被请求的资源已经永久转移至新的URL。
- 302 Found：临时重定向，表示被请求的资源暂时转移至新的URL。
4. 4xx（客户端错误类）：表示客户端发送的请求有错误。
- 400 Bad Request：请求错误，服务器无法理解该请求。
- 404 Not Found：未找到资源错误，服务器无法找到所请求的资源。
5. 5xx（服务器错误类）：表示服务器内部错误。
- 500 Internal Server Error：服务器内部错误。
三、HTTP请求方式HTTP定义了多种请求方法，常用的有以下几种：1.GET：请求获取指定资源，只用于获取数据，不应产生副作用。
2.POST：向指定资源提交数据进行处理，请求服务器接受客户端提供的实体作为打字稿。
3.PUT：向服务器上传新的实体，并替换指定资源的内容。
设置Access-Control-Allow-Origin实现跨域HTTP请求错误：Failed to load xxx: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.背景：在学习AngularJS的$http服务测试demo时出现该错误，demo实例：<div ng-app="myApp" ng-controller="myCtrl"><h1>服务器相应的信息为：</h1><p>{{ responseMsg }}</p></div><script>var app = angular.module('myApp',[]);app.controller('myCtrl',function($scope,$http){$http({method: 'GET',url: 'http://www.flyroc.top:8001/server0project/hello'}).then(function successCallback(response) {$scope.responseMsg = response.data;}, function errorCallback(response) {});});</script>解决：⽬前的浏览器为了数据的安全，所有请求被严格限制在同⼀域名下，如果需要从不同的服务器(不同域名)上获取数据，那么需要使⽤跨域HTTP请求。
实现跨域的⽅式是在请求的⽬标⽹站后台中(以java servlet为例)添加如下代码：response.setHeader("Access-Control-Allow-Origin","*"); //允许所有域名访问response.setHeader("Access-Control-Allow-Methods", "POST,GET,OPTIONS,DELETE");response.setHeader("Access-Control-Max-Age", "3600");response.setHeader("Access-Control-Allow-Headers", "x-requested-with,Authorization");response.setHeader("Access-Control-Allow-Credentials", "true");亲测只⽤response.setHeader("Access-Control-Allow-Origin","*");可以解决。
cors的实施方案CORS的实施方案。
跨域资源共享（CORS）是一种机制，它使用额外的 HTTP 头来告诉浏览器，让运行在一个 origin（domain）上的 Web 应用被准许访问来自不同源服务器上的指定的资源。
当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时，资源会发起一个跨域 HTTP 请求。
实施CORS的方案主要包括以下几个步骤：1. 服务器端设置响应头。
在服务器端设置响应头是实施CORS的第一步。
通过在HTTP响应头中添加Access-Control-Allow-Origin字段，可以指定允许访问该资源的域。
例如，如果想要允许所有域访问该资源，可以设置为""；如果只想允许特定域访问，可以将其设置为对应的域名。
2. 处理预检请求。
对于一些复杂的跨域请求，浏览器会先发送一个预检请求（OPTIONS请求），以确定服务器是否支持跨域请求。
在服务器端需要处理这个预检请求，并根据情况返回相应的响应头信息。
3. 客户端发送跨域请求。
在客户端发起跨域请求时，需要在请求头中添加Origin字段，以标识该请求是一个跨域请求。
浏览器会根据该字段判断是否允许该请求，并根据服务器返回的响应头信息决定是否允许访问。
4. 处理CORS错误。
在实施CORS过程中，可能会出现一些错误，如未设置正确的响应头、未处理预检请求等。
在服务器端需要对这些错误进行处理，并返回相应的错误信息，以便客户端进行相应的处理。
总结。
通过以上几个步骤，可以实施CORS机制，实现跨域资源共享。
在实际应用中，需要根据具体的业务需求和安全考虑，合理设置CORS的相关参数，以确保安全可靠的跨域访问。
同时，也需要在客户端和服务器端对CORS错误进行处理，以提升用户体验和系统稳定性。
CORS的实施方案可以帮助我们解决跨域访问的问题，使得Web应用能够更灵活地进行跨域资源共享，为用户提供更好的体验。
在实际开发中，我们需要充分理解CORS的机制和原理，合理设置CORS相关参数，以确保安全可靠的跨域访问。
解决跨域请求的几种方法（原创实用版3篇）篇1 目录1.解决跨域请求的几种方法2.引言3.方法一：使用代理服务器4.方法二：设置CORS5.方法三：JSONP6.方法四：设置Access-Control-Allow-Origin响应头7.结论篇1正文随着互联网的发展，跨域请求已经成为一种常见的需求。
但是，由于不同域名的安全策略不同，这会导致跨域请求被浏览器阻止。
为了解决这个问题，我们可以使用以下几种方法。
方法一：使用代理服务器代理服务器可以作为一个中转站，将请求转发到目标服务器。
这样，请求就不再是跨域请求了。
但是，这种方法需要自己搭建代理服务器或者使用第三方的代理服务器，成本较高。
方法二：设置CORSCORS是一种由浏览器实现的机制，允许服务器在响应中添加一些头部信息，告诉浏览器允许跨域请求。
这样，浏览器就会自动处理跨域请求，不再需要手动设置。
但是，这种方法需要目标服务器支持CORS，而且需要手动设置响应头。
方法三：JSONPJSONP是一种通过动态插入script标签的方式来获取跨域数据的方法。
当服务器返回的数据格式为script时，浏览器就会自动执行这个script标签中的内容。
这种方法不需要目标服务器支持CORS，但是需要手动编写callback函数。
方法四：设置Access-Control-Allow-Origin响应头Access-Control-Allow-Origin响应头允许指定允许跨域请求的域名。
当服务器返回这个响应头时，浏览器就会自动处理跨域请求。
篇2 目录1.跨域问题的背景和重要性2.解决跨域请求的几种方法3.解决跨域请求的几种方法的优缺点分析4.总结篇2正文一、跨域问题的背景和重要性在现代互联网应用中，跨域请求是一种常见的需求，即一个域名的资源需要被另一个域名的应用程序访问。
然而，由于不同域的JavaScript、CSS、图片等资源之间存在安全问题，浏览器会限制跨域请求，这给开发者带来了很大的困扰。
跨域的解决方案什么是跨域在前端开发中，当一个网页的域名、协议、端口与当前页面的域名、协议、端口不一致时，就会产生跨域问题。
跨域问题在前端开发中比较常见，了解跨域问题及其解决方案对于开发人员具有重要意义。
跨域引起的问题跨域问题会导致一些安全性问题，例如用户的信息可能被恶意获取。
因此，现代浏览器对跨域的请求进行了限制。
浏览器的同源策略（Same Origin Policy）阻止了跨域的请求，这使得在前端开发中进行跨域请求变得困难。
跨域解决方案为了解决跨域问题，前端开发人员可以采用以下几种常见的跨域解决方案：1. JSONPJSONP（JSON with Padding）是最早解决跨域问题的方法之一。
它利用script 标签的跨域性质来实现跨域请求。
JSONP的原理是通过在页面中插入一个script 标签，标签的src属性指向跨域请求的地址，并且在请求参数中将回调函数的名称作为参数传递给服务器。
服务器收到请求后，将数据作为参数传递到回调函数中，从而返回需要的数据。
JSONP的优点是兼容性好，但是只能支持GET请求，且无法处理错误，存在安全性问题。
2. CORSCORS（Cross-Origin Resource Sharing）是一种标准化的跨域解决方案。
它通过在服务器端设置响应头部，允许跨域请求访问资源。
在服务器端设置以下响应头信息即可实现跨域请求：Access-Control-Allow-Origin: 允许访问的域名Access-Control-Allow-Methods: 允许的 HTTP 方法Access-Control-Allow-Headers: 允许的头部字段CORS的优点是支持所有类型的 HTTP 请求，且安全性较高。
但是，需要服务器端的支持，且兼容性较差。
3. 代理代理是前端开发中常用的跨域解决方案。
通过在服务器端添加一个代理接口，将前端的请求发送到目标服务器上，再将响应返回给前端。
解决跨域请求的几种方法跨域请求是指在Web 开发中，由于浏览器的同源策略限制，导致在一个域名下的网页无法直接访问其他域名下的资源。
为了解决跨域请求的问题，开发者们提出了许多方法。
本文将介绍几种常用的解决跨域请求的方法。
1. JSONPJSONP（JSON with Padding）是一种通过动态创建`<script>` 标签来实现跨域请求的方法。
在客户端中，通过将回调函数名作为参数传递给服务器，服务器将返回一个以该函数名为函数名的JavaScript 代码片段。
客户端可以直接执行该代码片段，从而实现跨域请求。
2. CORSCORS（Cross-Origin Resource Sharing）是一种通过在服务器端设置HTTP 头部来实现跨域请求的方法。
在服务器端，设置`Access-Control-Allow-Origin` 头部，指定允许访问的源。
浏览器在发送跨域请求时，会先发送一个OPTIONS 请求，服务器在返回的响应头部中设置允许访问的源，从而实现跨域请求。
3. 代理服务器使用代理服务器是一种常见的解决跨域请求的方法。
在同源策略下，浏览器只允许向同一域名下发送请求。
通过在同一域名下搭建一个代理服务器，将跨域请求转发到目标服务器，再将响应返回给客户端，从而实现跨域请求。
4. WebSocketWebSocket 是一种在单个TCP 连接上进行全双工通信的协议，可以实现跨域请求。
它使用了自定义的协议头，可以在客户端和服务器之间建立长连接，实现实时通信。
由于WebSocket 连接不受同源策略的限制，可以在不同域名下进行跨域请求。
5. postMessagepostMessage 是 HTML5 中的一个特性，可以实现跨文档通信。
它允许在不同窗口或 iframe 之间传输数据，并且不受同源策略的限制。
通过在目标窗口中监听 message 事件，可以实现跨域请求。
以上是几种常用的解决跨域请求的方法。
jQuery.ajax跨域请求webapi设置headers的解决⽅案解决跨域调⽤服务并设置headers 主要的解决⽅法需要通过服务器端设置响应头、正确响应options请求，正确设置 JavaScript端需要设置的headers信息⽅能实现。
1.第⼀步服务端设置响应头,在webapi的web.config做如下设置<system.webServer><httpProtocol><!--跨域配置开始--><customHeaders><add name="Access-Control-Allow-Origin" value="*" /><!--⽀持全域名访问，不安全，部署后需要固定限制为客户端⽹址--><add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /><!--⽀持的http 动作--><add name="Access-Control-Allow-Headers" value="Content-Type,X-Requested-With,token" /><!--响应头请按照⾃⼰需求添加这⾥新加了token这个headers--> <add name="Access-Control-Request-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /><!--允许请求的http 动作--></customHeaders><!--跨域配置结束--></httpProtocol>2.第⼆部了解IE chrome 等浏览器对于跨域请求并要求设置Headers⾃定义参数的时候的 "预请求" 就是如果遇到跨域并设置headers的请求，所有请求需要两步完成！A 第⼀步：发送预请求 OPTIONS 请求。
浏览器拦截跨域请求处理⽅法（已阻⽌跨源请求：同源策略禁⽌读取远程资源）在浏览器请求中，出现跨域访问资源的问题，我们肯定会遇到。
如果跨域请求被阻⽌，有可能导致css、js 、ajax请求、font字体等资源出现⽆法正常访问的问题。
接下来，就介绍下解决同源策略不允许读取远程资源的问题。
今天就谈下远程字体跨域的问题。
直接了当了说，解决此类问题，最直接的⽅法就是，就是给被请求的服务器，添加HTTP头响应头，这⾥提供两种添加HTTP头的⽅法：第⼀种，就是在程序中添加HTTP头：如： Response.Headers.Add("Access-Control-Allow-Origin", "*");// JSON{'Access-Control-Allow-Origin': '*',}// HTML<meta http-equiv="Access-Control-Allow-Origin" content="*">// PHPheader("Access-Control-Allow-Origin: *");header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");添加此段代码的⽬的很简单，也就是告诉浏览器，这个资源是运⾏远程所有域名访问的。
当然，此处的*也可以替换为指定的域名，出于安全考虑，建议将*替换成指定的域名。
第⼆种，就是在服务器上，添加HTTP响应头。
在这⾥，我们就以IIS6.0为例：在被请求的⽹站上，设置HTTP头，添加“//在被请求的⽹站上，设置HTTP头，添加"Access-Control-Allow-Origin:*" //值为*或指定的域名。
html2canvas截图问题，图⽚跨域导致截图空⽩年前的⼀个项⽬，要做⼀个H5截屏分享的功能，使⽤的是html2canvas插件，截图功能是实现了，但是跨域的图⽚死活不出来，经过⼏天⾕歌百度和不断的尝试，终于找到解决办法了，⼀共经历了让⼈⼼⼒憔悴的两个坑：⼩坑： 跨域的logo和分享的⼆维码都出不来，1、需要在服务器IIS上的HTTP响应标头设置，最简单粗暴的⽅法就是全部设置成*，不过这样安全性也低，⾃⼰可以根据⾃⼰需求设置：access-control-allow-credentials:trueAccess-Control-Allow-Headers:*access-control-allow-origin:*2、在html2canvas添加参数useCORS设置：html2canvas(document.getElementsByClassName('codediv')[0], {useCORS: true,allowTaint: false}).then(function (canvas) { var url = canvas.toDataURL("image/png"); var oA = document.createElement("a"); oA.download = '测试截图';// 设置下载的⽂件名，默认是'下载' oA.href = url; document.body.appendChild(oA); oA.click(); oA.remove(); // 下载之后把创建的元素删除});⼤坑：⼆维码显⽰了，logo时⽽显⽰时⽽不显⽰，绞尽脑汁：解决⽅法：1、需先将以上两步设置好2、在img标签上设置 crossorigin="anonymous" 属性；3、需要在img的src后加上参数(我就是⼀直卡在这，⼀直不能解决)：。
前端开发中跨域问题解决方法随着互联网的迅猛发展，前端开发在如今的技术领域中扮演着至关重要的角色。
然而，在实际的开发过程中，经常会遇到跨域问题，给开发者造成不小的困扰。
本文将介绍前端开发中跨域问题的本质以及一些解决方法。
首先，我们需要了解什么是跨域问题。
跨域是指在浏览器中，当前页面的域名与资源请求的域名不一致，即在协议、域名或端口这三者中有一个不同。
由于浏览器的同源策略，跨域请求通常会被浏览器拦截，导致请求失败，因此需要采取相应的解决方法。
解决跨域问题的一种常见方法是通过设置服务器端的响应头来实现。
在服务器端设置Access-Control-Allow-Origin字段为*，可以允许所有域名的请求。
然而，这种方法存在一定的安全风险，因为允许任意域名的请求可能会导致信息泄露或其他安全问题。
因此，在实际开发中，我们应该根据实际需求设置Access-Control-Allow-Origin字段，只允许特定的域名或一组域名的请求。
还有一种解决跨域问题的方法是JSONP（JSON with Padding）。
JSONP利用了页面可以引入不同域名的JavaScript文件这一特点，通过动态创建script标签来请求跨域的数据，并将数据作为参数传递给指定的回调函数进行处理。
由于浏览器对script标签的请求不遵循同源策略，因此可以实现跨域请求。
此外，还可以使用代理服务器来解决跨域问题。
代理服务器作为一个中间层，将浏览器的请求发送给目标服务器，并将响应返回给浏览器。
由于代理服务器与目标服务器在同一个域下，因此不会触发跨域问题。
前端开发者可以通过配置代理服务器来转发请求，并将响应返回给浏览器，从而解决跨域问题。
另一种常见的跨域解决方法是使用CORS（Cross-Origin Resource Sharing）。
CORS通过在HTTP响应头中添加相关字段，告诉浏览器是否允许跨域请求。
服务器可以设置Access-Control-Allow-Origin字段来指定允许的域名，可以设置Access-Control-Allow-Headers字段来允许特定的请求头，还可以设置Access-Control-Allow-Methods字段来允许特定的请求方法。
express下的四种跨域解决方法在开发过程中，由于安全策略的限制，浏览器会阻止跨域的HTTP请求。
而在实际开发中，由于前后端分离的设计模式，需要经常进行跨域操作。
本文将介绍express下的四种跨域解决方法。
1.使用中间件Express是Node.js的一种Web开发框架，允许使用中间件来处理请求和响应。
跨域请求也可以使用中间件来解决。
Express已经内置了一个解决跨域问题的中间件，称为cors。
可以通过引入cors模块并使用其中间件函数来解决跨域问题。
以下是一个使用cors中间件的例子：```const express = require('express');const cors = require('cors');const app = express(;e(cors();```2.设置响应头在Express中，可以通过设置响应头来允许特定域名的跨域请求。
可以使用`res.header(`方法来设置响应头。
以下是一个设置响应头的例子：```const express = require('express');const app = express(;app.get('/', (req, res) =>res.send('Hello World!');});```3.使用代理另一种跨域解决方法是使用代理。
可以通过配置代理服务器将浏览器的请求转发到目标服务器，这样就绕过了浏览器的同源策略。
使用代理的好处是可以在代理服务器上添加额外的安全措施，如认证、限流等。
以下是一个使用代理的例子：```const express = require('express');const app = express(;e('/', (req, res) =>//处理跨域请求});app.listen(3000, ( =>console.log('Proxy server is running on port 3000');});```在上述例子中，Express应用充当了代理服务器的角色，通过处理跨域请求并将其转发到目标服务器。
XmlHttpRequest使⽤及“跨域”问题解决⼀. IE7以后对xmlHttpRequest 对象的创建在不同浏览器上是兼容的。
下⾯的⽅法是考虑兼容性的，实际项⽬中⼀般使⽤Jquery的ajax请求，可以不考虑兼容性问题。
function getHttpObject() {var xhr=false;if (windows.XMLHttpRequest)xhr=new XMLHttpRequest();else if (window.ActiveXObject){xhr=new ActiveXObject("Microsoft.XMLHttp");}return xhr;}⼆. XMLHttpRequest的属性及⽅法1、⽅法描述abort() 停⽌当前请求getAllResponseHeaders() 把HTTP请求的所有响应⾸部作为键/值对返回getResponseHeader(“header”) 返回指定键的⾸部串值open(“method”,”url”) 建⽴对服务器的调⽤，Method可以是GET，POST或PUT，URL可以是相对或绝对URL send（content）向服务器发送请求setRequestHeader(“header”,”value”) 把指定⾸部设置为所提供的值。
在设置任何⾸部之前必须调⽤open()2、属性描述onreadystatechange 每个状态改变都会触发，通常会调⽤⼀个javascript函数readyState 请求的状态，5个值； 0：为初始化，1：正在加载；2：已经加载，3：交互中，4：完成responseText 服务器的响应，表⽰为字符串responseXML 服务器的响应，表⽰为XML，可以解析为DOM对象status 服务器的HTTP状态码(200：ok,304:not modified,404:Not Found 等)statusText Http状态码的相应⽂本(ok或Not Found)3、⼿写⼀个Ajax请求的例⼦：eg1: get$(function(){$("#id").onclick(tunction(){var request=new XMLHttpRequest();var url="";var method="GET";request.open(method,url);request.send(null);request.onreadystatechange=function(){if (request.readyState==4&&(request.status==200 || request.status==304))alert (request.reponseText);//如果返回的是html 标签，则可以使⽤ //$(“#id2”).innerHtml=request.reponseText;//如果返回的xml格式,则需要将结果通过getElementByTagName(“”)[index]解析 //alert(request.reponseXML.getElementByTagName(“”)[index]) /*var type=request.getResponseHeader("Content-Type");if(type.indexOf("xml") !== -1 && request.responseXML){callback(request.responseXML); //Document对象响应}else if(type=== 'application/json'){callback(JSON.parse(request.responseText)) //JSON响应}else {callback(request.responseText);}*/} }) })eg2: post<script type="text/javascript">var xhr = new XMLHttpRequest();xhr.timeout = 3000;xhr.ontimeout = function (event) {alert("请求超时！");}var formData = new FormData();formData.append('tel', '182********');formData.append('psw', '111111');xhr.open('POST', ':8000/login');xhr.send(formData);xhr.onreadystatechange = function () {if (xhr.readyState == 4 && xhr.status == 200) {alert(xhr.responseText);}else {alert(xhr.statusText);}}</script>eg3:同步响应//同步响应//发起同步的HTTP GET请求以获得指定URL的内容//返回响应⽂本，或如果请求不成功或响应不是⽂本就报错。
JS跨域访问解决方案总结0引言：跨域请求，顾名思义，就是一个站点中的资源去访问另外一个不同域名站点上的资源。
这种情况很常见，比如说通过style标签加载外部样式表文件、通过 img 标签加载外部图片、通过 script 标签加载外部脚本文件、通过 Web font 加载字体文件等等。
默认情况下，脚本访问文档属性等数据采用的是同源策略（Same origin policy）。
同源策略：如果两个页面的协议、域名和端口是完全相同的，那么它们就是同源的。
同源策略是为了防止从一个地址加载的文档或脚本访问或者设置从另外一个地址加载的文档的属性。
如果两个页面的主域名相同，则还可以通过设置document.domain 属性将它们认为是同源的。
随着 Web2.0 和 SNS 的兴起，Web 应用对跨域访问的需求也越来越多，但在脚本中进行跨域请求是受安全性限制的，Web 开发人员迫切需要提供一种更安全、方便的跨域请求方式来融合（Mashup）自己的 Web 应用。
这样做的一个好处就是可以将请求分摊到不同的服务器，减轻单个服务器压力以提高响应速度；另外一个好处是可以将不同的业务逻辑分布到不同的服务器上以降低负载。
值得庆幸的是，跨域请求的标准已经出台，主流浏览器也已经实现了这一标准。
W3C 工作组中的 Web Applications Working Group（Web 应用工作组）发布了一个Cross-Origin Resource Sharing（跨域资源共享规范）推荐规范来解决跨域请求的问题。
该规范提供了一种更安全的跨域数据交换方法。
具体规范的介绍可以访问上面提供的网站地址。
值得注意的是：该规范只能应用在类似XMLHttprequest 这样的 API 容器内。
IE8、Firefox 3.5 及其以后的版本、Chrome浏览器、Safari 4 等已经实现了 Cross-Origin Resource Sharing 规范，已经可以进行跨域请求了。
HTTP跨域、HTTP状态码、HTTP请求⽅式、CS和BS模式1.跨域基本概念 只要协议、域名、端⼝有任何⼀个不同，都被当作是不同的域。
由于浏览器的同源策略，其限制之⼀是不能通过ajax的⽅法请求不同源的⽂档。
第⼆个限制是浏览器中不同域的框架(iframe)间是不能进⾏js的交互操作的。
2.跨域⽅式有哪些 1.通过document.domain跨域 修改document.domain的⽅式只适⽤于不同⼦域的框架间的交互。
2.通过location.hash跨域 因为⽗窗⼝可以对iframe进⾏URL读写，iframe也可以读写⽗窗⼝的URL，URL有⼀部分被称为hash，就是#号及其后⾯的字符，它⼀般⽤于浏览器锚点定位，Server端并不关⼼这部分，应该说HTTP请求过程中不会携带hash，所以这部分的修改不会产⽣HTTP请求，但是会产⽣浏览器历史记录。
此⽅法的原理就是改变URL的hash部分来进⾏双向通信。
每个window通过改变其他 window的location来发送消息（由于两个页⾯不在同⼀个域下IE、Chrome不允许修改parent.location.hash的值，所以要借助于⽗窗⼝域名下的⼀个代理iframe），并通过监听⾃⼰的URL的变化来接收消息。
这个⽅式的通信会造成⼀些不必要的浏览器历史记录，⽽且有些浏览器不⽀持onhashchange事件，需要轮询来获知URL的改变，最后，这样做也存在缺点，诸如数据直接暴露在了url中，数据容量和类型都有限等。
3.通过HTML5的postMessage⽅法跨域 ⾼级浏览器Internet Explorer 8+, chrome，Firefox , Opera 和 Safari 都将⽀持这个功能。
这个功能主要包括接受信息的"message"事件和发送消息的"postMessage"⽅法。
⽐如域的A页⾯通过iframe嵌⼊了⼀个域的B页⾯，可以通过以下⽅法实现A和B的通信 4.通过jsonp跨域 以上⼏种都是双向通信的，即两个iframe，页⾯与iframe或是页⾯与页⾯之间的。
配置http的响应头信息：属性名X-Frame-Options。
可以配置的参数有两个：X-Frame-Options 响应头有三个可选的值：DENY：页⾯不能被嵌⼊到任何iframe或frame中；SAMEORIGIN：页⾯只能被本站页⾯嵌⼊到iframe或者frame中；ALLOW-FROM：页⾯允许frame或frame加载。
在服务端设置的⽅式如下：Java代码:response.addHeader("x-frame-options","SAMEORIGIN");Nginx配置:add_header X-Frame-Options SAMEORIGINApache配置:Header always append X-Frame-Options SAMEORIGIN⼀般选第⼆个参数就可以了。
【步骤】1.在src⽬录下建⼀个包，命名为filter。
在包⾥建类名为FrameTao。
内容如下：package filter;import java.io.IOException;import javax.servlet.Filter;import javax.servlet.FilterChain;import javax.servlet.FilterConfig;import javax.servlet.ServletException;import javax.servlet.ServletRequest;import javax.servlet.ServletResponse;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class FrameTao implements Filter {public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {//必须HttpServletRequest request = (HttpServletRequest) req;HttpServletResponse response = (HttpServletResponse) res;//实际设置response.setHeader("x-frame-options", "SAMEORIGIN");//调⽤下⼀个过滤器（这是过滤器⼯作原理，不⽤动）chain.doFilter(request, response);}public void init(FilterConfig config) throws ServletException {}public void destroy() {}}2.在web.xml⽂件下添加以下内容：<!-- 设置Frame头，防⽌被嵌套 --><filter><filter-name>FrameFilter</filter-name><filter-class>filter.FrameTao</filter-class></filter><filter-mapping><filter-name>FrameFilter</filter-name><url-pattern>/*</url-pattern></filter-mapping>3.启动服务器。
