3-3 CORS跨域限制以及预请求验证

1、请求的时候增加请求头

请求的时候增加请求头
此时浏览器报错：

当请求的header不被允许时浏览器会报错。

2、预请求

不需要预请求的方法 不需要预请求的Content-Type 其它限制

查看预请求限制的文档：

3、预请求显示Header的demo

设置允许的请求头

设置允许的请求头
浏览器发送预请求：
预请求
预请求的method为OPTIONS，浏览器向服务器发送预请求询问此请求是否被允许，服务器返回200表示该请求是被允许的。
浏览器得知请求是被允许的，则向服务器发送真实请求：
真实请求

4、预请求限制Method的demo

将请求方法改为put：

此时请求被拒绝，因为默认预请求允许的方法不包括PUT

请求被拒绝
在服务器端加上对PUT的允许配置：

此时put方法就被允许了：

5、设置预请求验证的失效时间

Access-Control-Max-Age

总结：

X-Test-Cors  预请求
--------------------
Access-Control-Allow-Origin: '*',
Access-Control-Allow-Headers: 'X-Test-Cors',
Access-Control-Allow-Methods: 'POST,PUT,Delete',
Access-Control-Max-Age: '1000'   //1000秒之内不需要预请求的验证

在跨域的时候，

1.默认允许的方法只有GET、HEAD、POST ，其余 PUT 、DELETE 都是默认不允许的，浏览器会预请求去验证的。
2.默认允许的 Content-Type 有 text/plain、multipart/form-data、application/x-www-form-urlencoded 其余Content-Type 都需要 预请求验证
3.其他限制：请求头限制、XMLHttpRequestUpload 对象均没有注册任何事件监听器、请求中没有使用 ReadableStream 对象