For school recruit front-end caching and HTTP knowledge summary

A. Basic concepts

HTTP Features

• Simple and fast : When you call, simply transfer request method and path
• Flexible : allows transmission of any type of data object, the Content-Type marker
• No connections : server disconnect request is processed
• Stateless : each request is independent means, if required in front of the subsequent information processing, it must be retransmitted

Persistent connection Keep-Alive

• connection: ** Keep-Alive ** the client-server connections remain in effect prevent the establishment or re-establish the connection, except in the case of more than Keep-Alive specified time, unexpected power failure, etc.
• Request 1 -> Response 1 -> 2 Request -> response 2
• HTTP 1.1

Pipelining

• By persistent connection is completed
• Request 1 -> Request 2 -> 3 Request -> Response 1 -> response 2 -> 3 Response
• Only GET and HEAD can be pipelined, POST the restrictions
• HTTP 1.1

The difference between GET and POST

• GET request parameters passed in the URL length is limited, but it has POST
• GET more secure than POST, because the parameters directly exposed on the URL, it can not be used to transmit sensitive information
• GET parameters passed via the URL, POST Request body placed in
• GET fallback when the browser is harmless, and POST will submit the request again
• GET URL address can be generated by the collection , and not POST
• GET request will be actively browser cache , and POST will not, unless manually set
• GET request parameters are intact in the browser history, and the POST parameters are not retained
• GET request can only be url encoded, and support multiple encoding POST

Common status codes

• 200 OK: request has been processed normally
• 204 No Content: request handling success, but no resources can be returned to the client
• 301 Moved Permanently: Permanent Redirect
• 302 Found: Temporary Redirect
• 304 Not Modified: Resource not modified, does not return the resources, allow clients to access cached resources
• 400 Bad Request: Request parameter error
• 401 Unauthorized: requires user authentication requirements
• 403 Forbidden: the server understood the request, but the execution request denied
• 404 Not Found: resources on the server does not request. Path errors
• 408 Request Time-out: Request Timeout
• 500 Internal Server Error: Internal Server Error

II. Three-way handshake with the four waving

Three-way handshake

If it is two-way handshake

1. C：喂喂喂，我是 C，你听的到吗？
2. S：在在在，我能听到，我是 S，你能听到我吗?
3. C：(听到了，老子不想理你)
4. S：喂喂喂？听不听到？我 X，对面死了，我挂了。。

If it is four-way handshake

1. C：喂喂喂，我是 C，你听的到吗？ 
2. S：在在在，我能听到，我是 S，你能听到我吗? 
3. C：听到了，你呢？你能听到吗？
4. S：？？你是智障？我不是说了我能听到吗，不想跟 xx 说话。。。

Three-way handshake

1. C：喂喂喂，我是 C，你听的到吗？ 
2. S：在在在，我能听到，我是 S，你能听到我吗? 
3. C：听到了。我们今天去钓鱼吧。。balabala

to sum up

1. 第一次握手，C 端发送 S 端接收到，证明了 C 端的发送能力
2. 第二次握手，S 端发送 C 端接收到，证明了 S 端的接收能力和发送能力
3. 第三次握手，C 端发送 S 端接收到，证明了 C 端的接收能力
4. 在可靠的同时，还要考虑性能和时间问题，所以三次握手最合理

Four waving

Full-duplex

A and B can communicate with each other, texting analogy, the same time both sides can send messages to each other, independently of each other

Single duplex

A and B only one-way communication, the phone analogy, the same time only one person to speak, to listen to another person, if two people speak together, that everyone did not catch up, it does not make sense

Four waving

1. C：不好意思 S，我这边需要关闭连接了，你准备一下？
2. S：好的 C，我收到你的关闭信号了，我还有数据没发好，你等我下。
3. S：C 老弟，我可以关闭了，给你最后说一下，等下你回应我的话，我就直接关了；
4. C：好的老哥，我回应你一下，你收到就关闭吧，不用理我
5. S：(收到 ack 信息，直接就关闭了)，此过程不产生数据的交互，不算挥手次数
6. C：等待 2MSL(最大报文段生存时间)后，S 没东西给过来，我也关了；

The difference between the three-way handshake

Four middle waving waving the equivalent of twice the middle of a three-way handshake handshake split into two

Why largest newspaper and other paper C-terminal need to turn off after lifetime?

Worry about unreliable network packet loss caused by more than the maximum waiting time, even if not receive useless, so it can be closed.

III. Cache

Expires (strong cache)

• HTTP 1.0 field that indicates the cache expiration time, an absolute time

Expires: Thu, 10 Nov 2020 08:45:11 GMT

• Disadvantages: If the user modifies the local time, it may cause the browser cache invalidation judgment

Cache-control (strong cache)

• HTTP 1.1 field represents the maximum resource cache valid time (in seconds), during which time, the client does not need to send a request to the server, a higher priority than Expires

Cache-control:public, max-age=2592000

• Age-max : maximum aging time i.e.
• maxage-S : a proxy cache (such as cache CDN), priority higher than maxage
• revalidate-the MUST : If you exceed the max-age time, the browser must send a request to the server to verify that the resource is also effective
• Cache-NO : browser cache content, but not directly used, requesting confirmation to the server using
• Store-NO : without any cache
• public : all of the content can be cached (including client and proxy server, such as CDN)
• privite : All content is only the client can cache (default value)
• max-age = 0, must-revalidate equivalent and no-cache

Last-Modified & If-Modified-Since（弱缓存）

• Server tells the client through the Last-Modified Response Headers field resources was last modified time

Last-Modified: Mon, 10 Nov 2020 09:10:11 GMT

• The next time you request the same resources, to find out the browser "not sure whether expired" cache from its own cache. Therefore, in a Last-Modified value will be written into the last Request Headers If-Modified-Since header field of the request

If-Modified-Since: Mon, 10 Nov 2020 09:10:11 GMT

• Server sends If-Modified-Since the value of the Last-Modified field comparison. If they are equal, said unmodified, response 304, continue to return Last-Modified field; otherwise, said modified response status code 200, and returns the data and the new Last-Modified field
• Disadvantages:
  • Some server can not obtain accurate time
  • If the resource update speed is seconds unit, then the cache is not being used because it is the minimum time in seconds
  • If the file is dynamically generated by the server, then the update time of the method is always generated time, even though the file may not change, so no effect cache

Etag & If-None-Match (weak cache)

• Etag specific identifier is stored in files (usually generated hash or MD5), the server stores the file Etag field,

ETag: "asj1jbasdbb4skdbk-ajs"

• Process consistent with the Last-Modified & If-Modified-Since

If-None-Match: "asj1jbasdbb4skdbk-ajs"

• Etag higher priority than Last-Modified
• More rigorous, file conversion and change Etag

Hierarchical caching policy

1. Cache 200 is from : the bottom, the Expires, Cache-control control (Cache-control priority higher than the Expires), if the cache hit read directly, if there is no hit, then the next state
2. 304 : This layer consists of Last-Modified, Etag control (priority is greater than an Etag Last-Modified), if the check by the server, and returns 304 Old Last-Modified, Etag field, reads the browser cache; check if the server is not passed, the next state
3. 200 : If the server does not pass the check, or force the user to refresh the page, and then returns 200 documents as well as the new Last-Modified, Etag field, update the browser cache

to sum up

• Expires, Cache-control, Last- Modified & If-Modified-Since, Etag & If-None-Match times are in seconds for the dimension, and Etag & If-None-Match is based on file for the dimension, so Etag the most rigorous, file change will change Etag
• Priority: Cache-control> Expires> Etag> Last-Modified

IV. Reference article

A front-end cache read article

This article summarizes the most for his reference to a number of articles when part of the sample, but mistakenly deleted browser history, resulting in some refer to the article can not be recovered, if insiders please contact me, I will make up the original link.