1、源和跨域
源(origin)就是协议、域名和端口号。URL是由协议、域名、端口和路径组成。如果两个url的协议、域名和端口全部相同,则表示同源;否则就是跨域。
同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。
同源策略又分为以下两种:
DOM同源策略:禁止对不同源页面DOM 进行操作。这里主要场景是iframe跨域的情况,不同域名的iframe是限制互相访问的。
XMLHttpRequest同源策略:禁止使用XHR对象向不同源的服务器地址发起HTTP请求。
2、cors简介
CORS是一个w3c标准的访问机制,是跨域资源共享(Cross-origin resource sharing)的缩写。通常是在服务器端设置响应头(浏览器中也需要打开withCredentials属性),把发起的跨域的原始域名添加到Access-Control-Allow-Origin 中。
CORS跨域需要浏览器和服务器一起配合才能成功访问。浏览器将CORS请求分成两类:简单请求(sample request)和 非简单请求(not-so-simple request)。
简单请求需要满足以下需求:
请求方法是 head、get、post之一;
HTTP的头信息不超出以下几种字段:Accept、Accept-Language、Content-Language、Last-Event-ID、
Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain
凡是不同时满足以上两个条件的 就属于非简单请求。
从原理图中,可以看出,简单请求直接创建了跨域请求的XHR对象,复杂请求则需要发一个“预检”请求,服务器同意之后才能真正发起跨域请求。
3、CORS使用的头信息:
Request Headers(请求头):浏览器会自动识别跨域请求并添加对应的请求头,无需人为干预
Origin 表示发起跨域请求的原始域
Access-Control-Request-Method 表示发起跨域请求的方式,例如GET/POST
Access-Control-Request-Headers表示发起跨域请求的额外头信息
Response headers(响应头 ):通过服务端设置响应头,进行跨域授权,需要人为干预,如允许哪些域进行跨域请求,是否允许响应信息携带Cookie信息。
Access-Control-Allow-Origin 表示允许哪些原始域进行跨域访问
Access-Control-Allow-Credentials表示是否允许客户端获取用户凭据
Access-Control-Allow-Methods表示允许哪些跨域请求的提交方式。(例如GET/POST)
Access-Control-Allow-Headers表示跨域请求的头部的允许范围。
Access-Control-Expose-Headers表示允许暴露哪些头部信息给客户端。
使用说明:基于安全考虑,如果没有设置额外的暴露,跨域的通信对象XMLHttpRequest只能获取标准的头部信息。
Access-Control-Max-Age表示预检请求 [Preflight Request] 的最大缓存时间
4、CORS实现跨域访问
授权方式
方式1:返回新的CorsFilter
方式2:重写WebMvcConfigurer
方式3:使用注解(@CrossOrigin)
方式4:手工设置响应头(HttpServletResponse )
参考: