本文共 1227 字，大约阅读时间需要 4 分钟。

1.基本概念

同源，指的是协议、域名、端口均一致 之前提到的ajax遵循同源策略，之前我们用jsonp技术，借用script的src不受跨域影响的特性来请求资源，但有一定的局限性，仅支持GET请求；还有一种打破跨域限制的方法，就是CROS，可以支持所有类型的HTTP请求

cross-origin resource sharing(CORS)跨域资源共享：是一种使用额外HTTP首部实现跨域获取资源权限的机制

XMLHttprequest获取非同源资源会被浏览器拦截，除非响应报文包含了正确CORS响应头

如果服务器没有CORS响应头的设置，就会报错：No 'Access-Control-Allow-Origin' header is present on the requested resource

在php文件上加上Access-Control-Allow-Origin响应头（访问控制允许源）：

header('Access-Control-Allow-Origin:*');

报错就消失了，*代表允许所有源来访问

(后面的值可以是特定的域名，代表允许这个源来获取资源，若不设置此项默认只有同源才能获取)

2.分类

2.1.简单请求 2.1.1 使用下列方法之一： GET / POST / HEAD 2.1.2content-type值为下列之一 text/plain multipart/form-data application / x-www-form-urlencoded等 总而言之，前端仅需正常写，服务器配置响应头即可

2.2.预检请求：预先判断检查服务器是否允许处理这个请求

先用OPTIONS方式向服务器发起预检请求，服务器允许了，才能进行之后的资源请求 预检请求有一个有效期，在该有效期内，同样的资源请求不需要再发送预检请求

满足以下条件之一就需要发送预检请求：

1.使用非HEAD / POST / HEAD方法 2.content-type值不为下列之一 text/plain multipart/form-data application / x-www-form-urlencoded 3.人为设置了CORS安全的首部字段集合之外的首部字段

如，在发送请求时，人为设置了一个头部：X-user

需要在服务器设置允许此请求头：

header('Access-Control-Allow-Origin:*'); //允许访问源为所有header("Access-Control-Allow-Method:POST,GET,OPTIONS"); //允许发送的方法header("Access-Control-Allow-Header:X-user,Content-Type"); //允许设置的请求头header("Access-Control-Allow-Max-Age:86400"); //允许预检信息缓存的有效期

转载地址：http://pspk.baihongyu.com/