The difference between pressing Enter, F5, Ctrl+F5 in the browser address bar to refresh the web page

Many students asked, aren't they all refreshed? What's the difference? Actually, there are still.

Among them, pressing Enter in the address bar is divided into two situations. One is that the requested URI has not expired in the browser cache. At this time, the HTTP request message header displayed in the browser using the firebug plug-in for Firefox is as follows:

Host 192.168.3.174:8080

User-Agent Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0

Accept text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8

Accept-Language zh-cn,zh;q=0.5

Accept-Encoding gzip, deflate

Accept-Charset GB2312,utf-8;q=0.7,*;q=0.7

Connection keep-alive

The HTTP return status shows 200 OK, but the access.log of the background Nginx server does not find the record of the request, indicating that the request is not really submitted to the HTTP server. Instead, the browser finds that there are still unexpired files in the cache, and directly intercepts the request. The so-called "request header message" and "response header message" displayed in firebug are "forged" by the browser. This kind of refresh, the network traffic used is the smallest, it can be said that it is not at all, and the time consumption is also the least. It's like when you find a carton of milk that has not expired, you think there must be no problem, and no one tells you to drink it.

The second is that the requested URI has expired in the browser cache. At this time, the HTTP request message header displayed by firebug is as follows:

Host 192.168.3.174:8080

User-Agent Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0

Accept text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8

Accept-Language zh-cn,zh;q=0.5

Accept-Encoding gzip, deflate

Accept-Charset GB2312,utf-8;q=0.7,*;q=0.7

Connection keep-alive

If-Modified-Since Mon, 04 Jul 2011 10:12:40 GMT

There is an additional line of If-Modified-Since, and the access.log of the background Nginx server also finds the record of the request, indicating that the browser handles this situation as follows: ask the server again, the requested URI has a certain time later. Not modified, and this time is determined by the Last-Modified of the last HTTP response. After the server authenticates, if there is no modification, it will return 304 Not Modified. After the browser receives it, it will read the content from the cache; if there is a modification, it will return 200 OK and return the new content. In this case, it is like you find a box of milk that has expired, so you ask someone if you can drink it. If someone says yes, you drink it. If someone says no, then you have to find another fresh box. milk.

As for F5 refresh, its HTTP request message header is as follows:

Host 192.168.3.174:8080

User-Agent Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0

Accept text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8

Accept-Language zh-cn,zh;q=0.5

Accept-Encoding gzip, deflate

Accept-Charset GB2312,utf-8;q=0.7,*;q=0.7

Connection keep-alive

If-Modified-Since Mon, 04 Jul 2011 10:12:40 GMT

Cache-Control max-age=0

There is another line of Cache-Control: max-age=0, which means that I will go to the server to ask whether the files in the browser cache are expired or not, which is equivalent to the temporary invalidation of the Expires of the last HTTP response. The response processing flow of the server is the same as above. In this case, it's like when you find a carton of milk, you don't look at its expiry date, and you just ask others if they can drink it.

Finally, Ctrl+F5 refreshes, and its HTTP request message header is as follows:

Host 192.168.3.174:8080

User-Agent Mozilla/5.0 (Windows NT 5.1; rv:5.0) Gecko/20100101 Firefox/5.0

Accept text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8

Accept-Language zh-cn,zh;q=0.5

Accept-Encoding gzip, deflate

Accept-Charset GB2312,utf-8;q=0.7,*;q=0.7

Connection keep-alive

Pragma no-cache

Cache-Control no-cache

If-Modified-Since is gone, Cache-Control is replaced with no-cache. In addition, the Pragma line is for compatibility with HTTP1.0, and the function is the same as Cache-Control: no-cache. That means, I don't want the files in the cache anymore, force a refresh, and re-download directly to the server, so the server's response processing is the same as the first request for this URI, returning 200 OK and new content. This refresh uses the largest network traffic and is also the most time-consuming. It's like finding a carton of milk, throwing it away and going straight to buy a new one.

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325147373&siteId=291194637