绕不过的就突破

参考文档

　　 JSONP/ 跨域/ CORS

一、跨域

　　同源策略，IE有例外 eg 端口不做为是否同源的条件

　　　　没有同源策略的接口请求和DOM查询

　　正确姿式

　　JSONP　

　　　　JSONP的优点在于支持老式浏览器，以及能够向不支持CORS的网站请求数据　

　　　　HTML标签里，一些标签好比script、img这样的获取资源的标签是没有跨域限制

　　　　　　服务端收到url后回调前端定义的方法

　　　　　　post方法经过js构造iframe form表单提交模拟

　　CORS W3C标准　　cross-origin resource sharing（IE浏览器不能低于IE10）

　　　　请求头origin 不准可的话 --> 浏览器看响应头是否包含 Access-Control-Allow-Origin字段

　　　　　　若是要发送Cookie， Access-Control-Allow-Origin就不能设为星号

　　　　　　

　　　　　　预检preflight

　　　　　　　　request

　　　　　　　　　　origin

　　　　　　　　　　Access-Control-Request-Headers

　　　　　　　　　　Access-Control-Request-Method

　　　　　　　　response

　　　　　　　　　 Access-Control-Allow-Origin: *　　　　　

　　　　　　　　　　　　
 Access-Control-Allow-Methods: GET, POST, PUT (必须）

　　　　　　　　　Access-Control-Allow-Headers: X-Custom-Header （requestHeader有）

　　　　　　　　　Access-Control-Allow-Credentials: true

　　　　　　　　　Access-Control-Max-Age: 1728000

 

　　　　简单请求：同时知足一、2     (浏览器自动增长请求头origin)

　　　　（

　　　　　　一、HEAD GET POST

　　　　　　二、HTTP的头信息不超出如下几种字段：

　　　　　　　　Accept、Accept-Language、Content-Language、Last-Event-ID

• 　　　　　　　　Content-Type：只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

　　　　 ）

　　　　　　 // *时cookie不会在http请求中带上

 　　　　ctx.set('Access-Control-Allow-Origin', '*')

　　　　复杂请求

　　　　　　非简单请求会发出一次预检测请求，返回码是204，预检测经过才会真正发出请求，这才返回200。

　　nginx转发

　　　　location是NginxHttpCoreModule的重要指令，为匹配的URI进行配置

　　　　　　字符串、正则（须指定前缀） = ~ ~* !~ !~*

　　　　　　　　精确

　　　　　　　　不精确匹配

　　　　　　　　　　区分大小写

　　　　　　　　不匹配

 

　　DOM查询

　　 1.postMessage
　　　　window.postMessage() 是HTML5的一个接口，专一实现不一样窗口不一样页面的跨域通信。

　　二、 document.domain
　　　　这种方式只适合主域名相同，但子域名不一样的iframe跨域。
　　　　好比主域名是 http://crossdomain.com:9099，子域名是 http://child.crossdomain.com:9099，

　　　　这种状况下给两个页面指定一下document.domain即document.domain = crossdomain.com就能够访问各自的window对象了。

　　 3.canvas操做图片的跨域问题  回家赶忙找出 《css世界》读读　　

 

ps

　　www.baidu.com

　　主机名+DNS域名+一个点（.）

　　www是主机名也是默认的主机域名

　　一级(顶级)、二级、子域名

　　最右边.com是顶级域名（一级域名），其余 .cn,.net，.org，.gov，.edu，.tv

　　.com.cn　　.com是.cn下的二级域名

　　任何人都注册.com域名

　　image.baidu.com　　image是子域名