XMLHttpRequest通HTTP请求头和服务器HTTP响应头,实现CORS跨站资源共享时,对访问资源的权限验证。XMLHttpRequest跨域访问控制原理,可参考上篇文章,本文将详细介绍HTTP请求和服务器HTTP响应中Access-Control-*
等头信息。
1. CORS中的服务器HTTP响应头信息
HTTP响应头是指,XHR对象发送CORS跨域请求后,由服务器返回的Headers
信息。
1.1 Access-Control-Allow-Origin
Access-Control-Allow-Origin
响应头格式如下:
Access-Control-Allow-Origin:
origin
参数用于判断是否对指定的URI资源有访问权限。如果服务器对所有站点都开放访问,可以将其设置为*
。如果指对某一站点开放访问权限,可设置如下:
Access-Control-Allow-Origin: http://itbilu.com
1.2 Access-Control-Expose-Headers
Access-Control-Expose-Headers
用于设置允许浏览器访问的返回头:
Access-Control-Expose-Header: X-My-Custom-Header, X-Another-Custom-Header
上面的设置,将X-My-Custom-Header, X-Another-Custom-Header
两个头信息暴露给的浏览器,XHR可以在浏览器访问这两个头信息。
1.3 Access-Control-Max-Age
Access-Control-Max-Age
用于缓存此次请求的秒数:
Access-Control-Max-Age:
在delta-seconds
时间范围内,同类型的请求都不再发送预检请求而是直接使用此次返回的头作为判断依据,对于优化请求次数非常有用。
1.4 Access-Control-Allow-Credentials
Access-Control-Allow-Credentials
用于设置是否允许请求带有验证信息:
Access-Control-Allow-Credentials: true | false
1.5 Access-Control-Allow-Methods
Access-Control-Allow-Methods
用于设置允许使用的请求方法,多个以逗号分隔:
Access-Control-Allow-Methods: Access-Control-Allow-Methods:[, ]*
1.6 Access-Control-Allow-Headers
Access-Control-Allow-Headers
用于设置允许自定义的头信息,多个以逗号隔开,大小写不敏感:
Access-Control-Allow-Headers:[, ]*
2. CORS中的HTTP请求头信息
HTTP请求头是指,XMLHttpRequest对象在浏览器发送CORS跨域请求时,所发送的Headers
信息。
2.1 Origin
Origin
表示发起CROS跨域的源站点,此字段只有主机名(如:http://itbilu.com)而没有具体的路径:
Origin:
2.2 Access-Control-Request-Method
Access-Control-Request-Method
用于在preflight 请求
时,实际要发送的HTTP请求方法:
Access-Control-Request-Method:
2.3 Access-Control-Request-Headers
Access-Control-Request-Headers
用于在preflight 请求
时,实际要发送的HTTP请求中所要使用的Headers
方法:
Access-Control-Request-Headers:[, ]*
preflight 请求
中,XHR会在OPTIONS
嗅探请求阶段发送Access-Control-Request-Method
和Access-Control-Request-Headers
头信息,并跟据服务器的响应头信息判断是否有对指定资源的访问权限,并最终决定是否送实际请求。
设置HTTP请求头及HTTP响应头,请参考:处理XMLHttpRequest对象AJAX跨域请求问题