一，什么是CORN
由于浏览器会对不同域名，不同协议的请求采取一种保护策列，即你请求这些资源时候浏览器控制台会报跨域错误。通过设置响应报头的CORN参数来允许请求跨域资源。
二，CORN的使用场景
1，XMLHttpRequest或Fetch发送的请求
2，Web字体（css中通过@font-face使用跨源字体资源)
3,WebGL贴图
4，使用drawImage将Image/video 画面绘制到canvas
三，预检请求
客户端先发送一个OPTION请求给服务端，查询服务端支持客户端哪些请求方法，请求头字段，以获知服务端的客户端是否允许实际请求。“预检请求”可以避免跨域请求对服务器产生未预期的影响。
四，带Cookies情况
发送跨域请求时候，可携带身份凭证，比如发送XMLHttpRequest时候可设置属性withCredentials为true,从而向浏览器发送cookies,如果服务器端的响应中未携带Access-Control-Allow-Credentials: true，浏览器将不会把响应内容返回给请求的发送者。对于附带身份凭证的请求，服务器不得设置 Access-Control-Allow-Origin 的值为“*”。
五，Http响应首部字段
1，Access-Control-Allow-Origin
表示哪些外域可以访问响应的资源，如果是通配符"*"则表示所有外域都可以访问，如果指定了特定的域，则只有特定的外域才能访问
2，Access-Control-Expose-Headers
告诉服务器需要额外支持哪些头
比如 Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Header
3，Access-Control-Max-Age
指定了缓存能被缓存的时间
4，Access-Control-Allow-Credentials
指定浏览器是否可以读取响应内容，如果为true表示可以读取
5，Access-Control-Allow-Methods
放回服务器支持哪些请求方法，比如GET,PUT等
6，Access-Control-Allow-Headers
首部字段用于预检请求的响应。其指明了实际请求中允许携带的首部字段。
六，Http请求首部字段
1，Origin
首部字段表明预检请求或实际请求的源站。
2，Access-Control-Request-Method
首部字段用于预检请求。其作用是，将实际请求所使用的 HTTP 方法告诉服务器。
3，Access-Control-Request-Headers
首部字段用于预检请求。其作用是，将实际请求所携带的首部字段告诉服务器。
本文摘自MDN官网
网友评论