超文本传输协议(HyperText Transfer Protocol,缩写:HTTP)是互联网上应用最为广泛的一种网络协议。 设计HTTP最初的目的是为了提供一种发布和接收HTML页面的方法。 通过HTTP或者HTTPS协议请求的资源由统一资源标识符(Uniform Resource Identifiers,URI)来标识。 HTTP是一个客户端终端(用户)和服务器端(网站)请求和应答的标准(TCP)
通常,由HTTP客户端发起一个请求,创建一个到服务器指定端口(默认是80端口)的TCP连接。 HTTP服务器则在那个端口监听客户端的请求。 一旦收到请求,服务器会向客户端返回一个状态,比如”HTTP/1.1 200 OK”,以及返回的内容,如请求的文件、错误消息、或者其它信息
HTTP/0.9
HTTP/1.0
HTTP/1.1
HTTP/2
HTTP/1.1协议中共定义了八种方法(也叫“动作”)来以不同方式操作指定的资源
1xx:消息——请求已被服务器接收,继续处理 2xx:成功——请求已成功被服务器接收、理解、并接受 3xx:重定向——需要后续操作才能完成这一请求 4xx:请求错误——请求含有词法错误或者无法被执行 5xx:服务器错误——服务器在处理某个正确请求时发生错误
通过http获取网络数据的成本是非常高的,尤其是当需要大范围获取数据的时候,好在浏览器都有缓存策略
1.使用 ETag 验证缓存的响应: 服务器下发给客户端的时候在ETag头返回一个验证令牌Response Headers(ETag:”58b4e12b-2492d”) 当客户端再次请求的时候讲令牌带上,Request Headers(If-None-Match:W/“58b4e12b-2492d”) 服务端验证令牌如果没有发生改变则返回304
2.Cache-Control: 每个资源都可以通过 Cache-Control HTTP 头来定义自己的缓存策略 Cache-Control 指令控制谁在什么条件下可以缓存响应以及可以缓存多久
Cache-Control 头在 HTTP/1.1 规范中定义,取代了之前用来定义响应缓存策略的头(例如 Expires)。当前的所有浏览器都支持 Cache-Control,因此,使用它就够了
3.expires: Expires 头指定了一个日期/时间, 在这个日期/时间之后,HTTP响应被认为是过时的 如果还有一个 设置了 “max-age” 或者 “s-max-age” 指令的Cache-Control响应头,那么 Expires 头就会被忽略。
当一个资源从该资源本身所在的服务器不同的域或端口请求一个资源时,资源会发起一个跨域http请求 处于安全原因,浏览器会限制从脚本内发起的跨域http请求。 例如,XMLHttpRequest和Fetch API遵循同源策略。 这意味着使用这些API的Web应用程序只能从加载应用程序的同一个域请求HTTP资源,除非使用CORS头文件。
(跨域并非不一定是浏览器限制了发起跨站请求,而也可能是跨站请求可以正常发起,但是返回结果被浏览器拦截了。最好的例子是 CSRF 跨站攻击原理,请求是发送到了后端服务器无论是否跨域!注意:有些浏览器不允许从 HTTPS 的域跨域访问 HTTP,比如 Chrome 和 Firefox,这些浏览器在请求还未发出的时候就会拦截请求,这是一个特例。)———— MDN HTTP访问控制(CORS)
CORS(跨域资源共享) 机制允许web应用服务进行跨域访问控制。现代浏览器支持在 API 容器中(例如 XMLHttpRequest 或 Fetch )使用 CORS,以降低跨域 HTTP 请求所带来的风险
跨域资源共享标准( cross-origin sharing standard )允许在下列场景中使用跨域 HTTP 请求:
1.由XMLHttpRequest 或 Fetch 发起的跨域 HTTP 请求。
2.Web 字体 (CSS 中通过 @font-face 使用跨域字体资源), 因此,网站就可以发布 TrueType 字体资源,并只允许已授权网站进行跨站调用。
3.WebGL 贴图
4.使用 drawImage 将 Images/video 画面绘制到 canvas
5.样式表(使用 CSSOM)
6.Scripts (未处理的异常)
跨域资源共享标准新增了一组 HTTP 首部字段,允许服务器声明哪些源站有权限访问哪些资源。另外,规范要求,对那些可能对服务器数据产生副作用的 HTTP 请求方法(特别是 GET 以外的 HTTP 请求,或者搭配某些 MIME 类型的 POST 请求),浏览器必须首先使用 OPTIONS 方法发起一个预检请求(preflight request),从而获知服务端是否允许该跨域请求。服务器确认允许之后,才发起实际的HTTP请求。在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括 Cookies 和 HTTP 认证相关数据)。 (预检请求一般是浏览器检测到请求跨域之后自动发起的,预检请求报文中的 Access-Control-Request-Method 首部字段告知服务器实际请求所使用的 HTTP 方法;Access-Control-Request-Headers首部字段告知服务器实际请求所携带的自定义首部字段。服务器基于从预检请求获得的信息来判断,是否接受接下来的实际请求。)
跨域请求分两种:简单请求和预检请求。
需要满足下列所有的条件,为简单请求。
1.使用下列方法之一: GET/POST/HEAD
2.Fetch 规范定义了对 CORS 安全的首部字段集合,不得人为设置该集合之外的其他首部字段。该集合为:
Accept
Accept-Language
Content-Language
Content-Type (需要注意额外的限制)
DPR
Downlink
Save-Data
Viewport-Width
Width
3.content-type值仅限于下列三者之一
text/plain
multipart/form-data
application/x-www-form-urlencoded
4.请求中的任意XMLHttpRequestUpload 对象均没有注册任何事件监听器;XMLHttpRequestUpload 对象可以使用 XMLHttpRequest.upload 属性访问。
5.请求中没有使用 ReadableStream 对象。
默认跨域请求是不会发送基于 HTTP cookies 和 HTTP 认证信息的身份凭证的。如果要发送身份凭证,需要设置XMLHttprequest的某个特殊标志位。 如:
xhr.withCredentials = true
之后,服务端需要在响应中携带下面的属性,浏览器才会将收到的响应内容返回给请求的发送者
Access-Control-Allow-Credentials: true // 响应头表示是否可以将对请求的相应暴露给页面。返回true则可以,其它则不可以
对于附带身份凭证的请求,服务器不得设置 Access-Control-Allow-Origin 的值为( * )
Access-Control-Allow-Origin: <origin> | *
在跨域访问时,XMLHttpRequest对象的getResponseHeader()方法只能拿到一些最基本的响应头,Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma,如果要访问其他头,则需要服务器设置本响应头。 如:
Access-Control-Expose-Headers: X-My-Custom-Header, X-Another-Custom-Header
Access-Control-Allow-Credentials 头指定了当浏览器的credentials设置为true时是否允许浏览器读取response的内容。
XDomainRequest是在IE8和IE9上的HTTP access control (CORS) 的实现,在IE10中被 包含CORS的XMLHttpRequest 取代了,如果你的开发目标是IE10或IE的后续版本,或想要支待其他的浏览器,你需要使用标准的HTTP access control。 该接口可以发送GET和POST请求 XDomainRequest为了确保安全构建,采用了多种方法。 被请求的URL的服务器必须带有 设置为(“ * ”)或包含了请求方的Access-Control-Allow-Origin的头部。
限制
1.必须使用 HTTP 或 HTTPS 协议访问目标 URL(不能http、https跨协议访问)
2.只能使用 HTTP 的 GET 方法和 POST 方法访问目标 URL
3.请求中不能加入自定义的报头
4.只支持 text/plain 作为请求报头Content-Type的取值
5.身份验证和cookie不能和请求一起发送 (解决办法,将cookie等信息放在请求body里面)
...
维基百科(需代理方能打开) http1.0和http1.1的区别 http缓存 alloyteam浅谈web缓存 维基百科http状态码 三次握手与四次挥手