4343
4444---
4545
46- # 跨域的解决方法
46+ ## 跨域的解决方法
4747
4848** 业务环境中一些跨域场景**
49491 . 比如后端开发完一部分业务代码后，提供接口给前端用，在前后端分离的模式下，前后端的域名是不一致的，此时就会发生跨域访问的问题。
50502 . 程序员在本地做开发，本地的文件夹并不是在一个域下面，当一个文件需要发送 ajax 请求，请求另外一个页面的内容的时候，就会跨域。
51513 . 电商网站想通过用户浏览器加载第三方快递网站的物流信息。
52524 . 子站域名希望调用主站域名的用户资料接口，并将数据显示出来。
5353
54- ## CORS（跨域资源共享）
54+ ### CORS（跨域资源共享）
5555
5656CORS（Cross-origin resource sharing，跨域资源共享）是一个 W3C 标准，定义了在必须访问跨域资源时，浏览器与服务器应该如何沟通。CORS 背后的基本思想，就是使用自定义的 HTTP 头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功，还是应该失败。
5757
@@ -133,7 +133,7 @@ Access-Control-Max-Age: 1728000
133133
134134---
135135
136- ## JSONP 跨域
136+ ### JSONP 跨域
137137
138138由于 script 标签不受浏览器同源策略的影响，允许跨域引用资源。因此可以通过动态创建 script 标签，然后利用 src 属性进行跨域，这也就是 JSONP 跨域的基本原理。
139139
@@ -165,7 +165,7 @@ body.appendChild(script);
165165
166166---
167167
168- ## HTML 标签跨域
168+ ### HTML 标签跨域
169169
170170` <script> ` ` <img> ` ` <iframe> ` ` <link> ` 等带 src 属性的标签都可以跨域加载资源，而不受同源策略的限制。
171171
@@ -216,13 +216,13 @@ img.src = 'http://www.xxxx.cn/test?name=xxx';
216216
217217---
218218
219- ## 服务器代理
219+ ### 服务器代理
220220
221221浏览器有跨域限制，但是服务器不存在跨域问题，所以可以由服务器请求所有域的资源再返回给客户端。
222222
223223---
224224
225- ## document.domain 跨域
225+ ### document.domain 跨域
226226
227227对于主域名相同，而子域名不同的情况，可以使用 document.domain 来跨域。这种方式非常适用于 iframe 跨域的情况。
228228比如，有一个页面，它的地址是 http://www.xxx .cn/a .html，在这个页面里面有一个 iframe，它的 src 是 http://xxx.cn/b .html。很显然，这个页面与它里面的 iframe 框架是不同域的，所以我们是无法通过在页面中书写 js 代码来获取 iframe 中的东西的。
@@ -274,7 +274,7 @@ img.src = 'http://www.xxxx.cn/test?name=xxx';
274274
275275---
276276
277- ## window.name 跨域
277+ ### window.name 跨域
278278
279279window 对象有个 name 属性，该属性有个特征：即在一个窗口（window）的生命周期内，窗口载入的所有的页面（不管是相同域的页面还是不同域的页面）都是共享一个 window.name 的，每个页面对 window.name 都有读写的权限，window.name 是持久存在一个窗口载入过的所有页面中的，并不会因新页面的载入而进行重置。
280280
@@ -322,7 +322,7 @@ window 对象有个 name 属性，该属性有个特征：即在一个窗口（w
322322
323323---
324324
325- ## window.postMessage 跨域
325+ ### window.postMessage 跨域
326326
327327window.postMessage(message，targetOrigin) 方法是 HTML5 新引进的特性，可以使用它来向其它的 window 对象发送消息，无论这个 window 对象是属于同源或不同源。这个应该就是以后解决 dom 跨域通用方法了。
328328
@@ -358,7 +358,7 @@ window.postMessage(message，targetOrigin) 方法是 HTML5 新引进的特性，
358358
359359---
360360
361- ## location.hash 跨域
361+ ### location.hash 跨域
362362
363363location.hash 方式跨域，是子框架修改父框架 src 的 hash 值，通过这个属性进行传递数据，且更改 hash 值，页面不会刷新。但是传递的数据的字节数是有限的。
364364
@@ -391,7 +391,7 @@ a.html 欲与 b.html 跨域相互通信，通过中间页 c.html 来实现。
391391
392392---
393393
394- ## flash
394+ ### flash
395395
396396flash 有自己的一套安全策略，服务器可以通过 crossdomain.xml 文件来声明能被哪些域的 SWF 文件访问，SWF 也可以通过 API 来确定自身能被哪些域的 SWF 加载。
397397
@@ -400,6 +400,7 @@ flash 有自己的一套安全策略，服务器可以通过 crossdomain.xml 文
400400
401401---
402402
403- ** Source & Reference**
403+ ## Source & Reference
404+
404405- [浏览器同源策略及跨域的解决方法 ](https://juejin.im/post/6844903681683357710)
405406- [同源策略那些事 ](https://xz.aliyun .com/t/6614)
0 commit comments