Fork Me On Github
zodream 技术 2018-12-06

CORS:跨域资源共享

实际分两步请求:

第一步.预检:(无论响应什么数据都不会传到js程序里,只是浏览器做判断用,可以根据 请求方式 OPTIONS 和 Origin 请求头判断是否是预检

请求头:OPTIONS

Access-Control-Request-Headers: content-type
Access-Control-Request-Method: GET
Origin: http://localhost:4200

Access-Control-Request-Headers  告诉服务端第二步将带的请求头

Access-Control-Request-Method 第二步将使用的请求方式

Origin 当前的域名

允许的响应头:

Access-Control-Allow-Credentials:
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 0

Access-Control-Allow-Credentials 告诉浏览器第二步是否允许带上cookie 默认不带, true 为带上

Access-Control-Allow-Headers 允许带的请求头,必须全匹配才行, * 表示允许任何请求头

Access-Control-Allow-Methods 允许的请求方式  * 都允许

Access-Control-Allow-Origin 允许的请求域名 * 不限制

Access-Control-Max-Age   这个响应首部表示 preflight request  (预检请求)的返回结果(即 Access-Control-Allow-Methods 和Access-Control-Allow-Headers 提供的信息) 可以被缓存多久。

注:需要注意的是Access-Control-Max-Age的设置针对完全一样的url,如果url加上路径参数,其中一个url的Access-Control-Max-Age设置对另一个url没有效果


第二步.正式请求:(如果第一步没有获取到允许的响应头就不会发生第二步)

本次依然需要加上允许的跨域的响应头,js程序才能接收到相应的数据

点击查看全文
0 467 0