绕不过的就突破

参考文档

　　JSONP/跨域/CORS

1、跨域

　　同源策略，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

 

　　　　简单请求：同时满足1、2     (浏览器自动增加请求头origin)

　　　　（

　　　　　　1、HEAD GET POST

　　　　　　2、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的一个接口，专注实现不同窗口不同页面的跨域通讯。

　　2、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是子域名