HTTP之跨域

跨域（Cors）
- 两种请求
- - 简单请求

跨域（Cors）

Cors => 跨域资源共享

同源策略：端口、域名、协议

跨域构成的条件：

端口不同

协议不同

域名不同

只要不同源

两种请求

简单请求

两个条件：

请求方法是：HEAD,GET,POST

header中只能包含以下请求字段：

Accpet

Accpet-Language

Conten-Language

Content-Type（所指的媒体类型值仅仅限于下列三者之一）
*

text/plain

multipart/form-data

application/x-www-form-urlencoded

浏览器不同的处理方式

对于简单请求来说，如果请求跨域，那么浏览器会放行让请求发出。浏览器会发出cors请求，并携带origin。

http 复制代码

GET/cors HTTP/1.1
Origin:http://www.baidu.com
Host:api.alice.com
Accept-Language:en-US
Connections:keep-alive
User-Agent:Mozilla/5.0
...

此时不管服务端返回的是什么，浏览器都会把返回拦截，并检查返回的response的header中有没有Access-Control-Allow-Origin，这个头部信息的值通常为请求的Origin值，表示允许该来源的请求说明资源是共享的，可以拿到。

http 复制代码

Access-Control-Allow-Origin: http://www.baidu.com
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: FooBar
Content-Type: text/html; charset=utf-8

Access-Control-Allow-Origin

该字段是必须的。

它的值要么是请求时Origin字段的值，要么是一个*,表示接收任意域名的请求。

如果Origin头部信息的值为*（表示允许来自任何来源的请求）但这种情况下需要谨慎使用，应为它存在安全隐患。如果没有这个头信息，说明服务端没有开启资源共享，浏览器会认为这次请求失败终止这次请求，并且报错。

Access-Control-Allow-Credentials

该字段可选。

它的值是一个布尔值，表示是否允许发送Cookie。默认情况下，Cookie不包括在CORS请求中。

设为true，即表示服务器明确许可，Cookie可以包含在请求中，一起发给服务器，这个值也只能设为true，如果服务器不需要浏览器发送Cookie，删除该字段即可。

withCredentials属性

CORS请求默认不发送Cookie和HTTP认证信息。如果要把Cookie发送到服务器，一方面要服务器同意，指定Access-Control-Allow-Credentials字段

http 复制代码

Access-Control-Allow-Credentials:true

非简单请求

只要不满足简单请求的条件，都认为是非简单请求。

先发送OPTIONS 预检请求

OPTIONS请求按照简单请求的方式处理

目的：保护客户端的安全，防止不受信任的网站利用用户的浏览器向其他网站发送恶意请求。

Access-Control-Request-Method：告诉服务器实际发送的HTTP请求方法。

Access-Control-Request-Header：告诉服务器实际请求所携带的自定义的头部信息。

http 复制代码

OPTIONS /resources/post-here/ HTTP/1.1
Host: bar.other
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Origin: http://www.baidu.com
Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-PINGOTHER, Content-Type

服务器根据以上信息决定，该请求是否被允许

服务器回应：

http 复制代码

Access-Control-Request-Method: POST
Access-Control-Request-Headers: X-PINGOTHER, Content-Type

什么时候会触发OPTIONS（预检请求）呢？

跨域的时候：Access-Control-Request-Headers:X-PINGOTHER,Content-Type
发送跨域的时候：使用PUT、DELETE、CONNECT、OPTIONS、TRACE、PATCH等请求方法。

好啦~这就是今天的新知识点【跨域】，看到这里有一点点了解了吗？

加油丫，正在进步的友友们~