一、简单请求与非简单请求

跨域请求分为简单与非简单请求,同时满足以下两种条件的可以确定为简单请求。 简单请求的请求方法

请求方法 说明
head 发送头部信息
get  
post  

简单请求的HTTP头信息

http头信息 说明
accept 指定客户端可以接受哪类信息,eg: image/git
accept-language 指定客户端可以接受的自然语言,如果没有指定,认为各语言都可以。eg:accept-language: zh-cn
content-language 描述实体报头和资源所用的自然语言。没有设置该规则认为实体内容将提供给所有的语言阅读
Last-Event-ID 最后一次接收到事件的标识符
content-type 实体报文和资源的类型,只限于三个值:application/x-www-form-unlencoded、multipart/form-data、text/plain

二、简单请求处理原理

请求头 说明
Access-Control-Allow-origin 指定可以跨域访问的网站,可以设置为*,表示所有res.setHeader("Access-Control-Allow-origin","http://localhost")
Access-Control-Allow-Credentials 有这个头或者值为true,表示可接受跨域的cookies。而withCredentials是客户端设置是否传递cookies到服务器。
Access-Control-Expose-Headers 默认cors请求。客户端的xmlHttpRequrest只能拿到Cache-Control、Content-Language、Content-Type、Exprise、Last-Modified、Pragma等6个字段,其他头就需要通过Access-Control-Expose-Headers来指定

注意事项

  1. 设置了Access-Control-Allow-Credentials为true,或者有这个头,那么Access-Control-Allow-Origin就不能用*。
  2. 发送cookie时,Access-Control-Allow-Origin不能为*,cookie依然同源,只有服务器域名设置的cookie才会上传的。
  3. 原网页代码中的document.cookie也无法读取服务器域名下的cookie(客户端),通过xmlHttp.getResponseHeader("set-cookies")也不可以的。
  4. xmlHttp可以获取到foo、boo对象
res.setHeader("Access-Control-Allow-origin","*");
res.setHeader("Access-Control-Expose-Headers", "foo,boo"),
res.setHeader("foo", "foo");
res.setHeader("boo", "boo");

三、非简单请求处理原理

如果请求方法是PUT、DELETE,或者Content-type的类型为applicetion/json的。非简单请求两大步骤:

  1. 预验证“请求”,浏览器会发送请求方法为options的请求,然后会带上如下三个头
头部名称 说明
Origin 表示发送请求发送的源域名
Access-Control-Request-Method 需要跨域执行的请求方法(也可以叫动作)
Access-Control-Request-Headers 指定cors请求会额外发送的头部信息,给客户端自定义头部的机会
  1. 服务判断是否指定了Access-Control-Allow-Origin头,并且值是可匹配的,验证通过则输出信息如下头部内容:
头部名称 说明
Access-Control-Allow-Methods 表明服务器支持的cors请求方法,多个用逗号隔开
Access-Control-Allow-Headers 如果请求有了Access-Control-Request-Headers头,必须返回此头,表明服务器支持的所有头部信息,多个用逗号隔开
Access-Control-Allow-Credentials 与简单请求一致
Access-Control-Max-Age 指定本次预验证的有效期,单位:秒

注意:

  1. Access-Control-Request-Headers和Access-Control-Request-Method不需要开发者来设置,这是浏览器自动识别的.Access-Control-Request-Headers根据请求的自定义头生成,而Access-Control-Request-Method根据请求的方法生成。
  2. headers设置不对的表现:

3. 正确的设置:

四、跨域cookie的处理(不行)

  1. 跨域是设置不了cookie的。服务端输出的cookie无效
  2. ajax获取set-Cookies头(客户端),会提示错误

最新文章

  1. 【EasyUI】 日期格式化
  2. databasefactory.createdatabase Web.config 配置关键点提醒
  3. 获得省市 json 后台代码
  4. MFC 配合 protobuff libevent 实现的Socket 的GM工具 框架
  5. webservice 协议
  6. C++的优秀特性1:引用
  7. Spark Streaming揭秘 Day19 架构设计和运行机制
  8. 一段网上java常见escape和unescape方法的BUG
  9. 关于sql 资源竞争死锁现象
  10. 求帮看!!!!BZOJ 1014 [JSOI2008]火星人prefix
  11. jQuery的map()与jQuery.map()总结
  12. 阿里笔试js题
  13. IDEA第二章----配置git、tomcat(热部署)、database,让你的项目跑起来
  14. 安卓Tv开发(二)移动智能电视之焦点控制(按键事件)
  15. ReactJs 的各个版本生命周期、API变化 汇总(一、V16.0.0)
  16. spring cloud 微服务日志跟踪 sleuth logback elk 整合
  17. C#事件の事件聚合器(二)
  18. 两个有序数组的上中位数和第K小数问题
  19. java 生成Http 头部date格式的string-RFC 1123 Date Representation in java
  20. RHEL6安装配置DNS服务

热门文章

  1. 我的Python笔记02
  2. vue 手机端样式统一配置
  3. JavaScript(八)
  4. Chrome 启动全屏,并可以F11退出
  5. Java语法细节 - 内存和枚举
  6. Js 运行机制和Event Loop
  7. Github远程推送一直Everything up-to-date
  8. SDKmanager的位置
  9. seed实验——Set-UID Program Vulnerability实验
  10. Rewrite JSON project with Fetch