瀏覽器中回車(Enter)和刷新的區別是什麽?[轉載]
在瀏覽器中回車和F5刷新有什麽區別那?今天就來說說:瀏覽器中回車(Enter)和刷新的區別是什麽? 這點事。
概論:
1、回車在 Expires有效的時候,是不會去請求服務器的,打開調試看到的請求也只是偽造的,比如 谷歌瀏覽器可能顯示 200(cached)(比正常的200多了) 其實是沒有發起實際的緩存,直接讀取本地硬盤緩存。
2、如果按了 f5則 Expires設置不再起效果,只有Last-Modified/ETag有效果,如果在緩存期間內則返回 304,再讀取本地緩存內容
3、ctrl+f5則會發送 Cache-Control: no-cache,真正的從服務器重新獲取文件,此時緩存完全失效
先來說“刷新”,它是在你現有頁面的基礎上,檢查網頁是否有更新的內容。在檢查時,會保留之前的一些變量的值,因此有可能會造成刷新後網頁出現錯誤,或者打不開的情況;“轉到”和在地址欄回車,則相當於你重新輸入網頁的URL訪問,這種情況下,瀏覽器會盡量使用已經存在於本機中的緩存。也就是,“刷新” 是取網頁的新內容來更新本機緩存,在更新的同時保留之前的一些變量;“轉到”則是一種全新的訪問,它會盡量使用本機緩存中的文件,但不會保留之前的變量,這下應該明白了吧?另外,按著Ctrl,還可以進行強制刷新,跟轉到的作用差不多。
不少同學問,不都是刷新嗎?還有什麽區別?其實,還是有的。
其中,在地址欄按回車又分為兩種情況。一是請求的URI在瀏覽器緩存中未過期,此時,使用Firefox的firebug插件在瀏覽器裏顯示的HTTP請求消息頭如下:
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
Connection keep-alive
HTTP返回狀態顯示200 OK,但是,後臺Nginx服務器的access.log並沒有找到該請求的記錄,說明請求並沒有真正提交到HTTP服務器。而是被瀏覽器發現緩存中還有 未過期的文件,直接把請求攔截了,firebug裏面顯示所謂的“請求頭消息”、“響應頭消息”都是瀏覽器“偽造”的。這種刷新,使用的網絡流量是最小 的,可以說完全沒有,時間消耗也是最少的。就像你找到一盒沒有過期的牛奶,覺得肯定沒有問題,誰都沒告訴就喝了。
二是請求的URI在瀏覽器緩存中已過期,此時,firebug顯示的HTTP請求消息頭如下:
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
多了一行If-Modified-Since,後臺Nginx服務器的access.log也找到了該請求的記錄,說明瀏覽器對這種情況的處理方法是:再 問一下服務器,請求的URI在某個時間之後有沒有被修改過,而這個時間是由上次HTTP響應的Last-Modified決定的。服務器鑒定之後,沒有修 改的話,返回304 Not Modified,瀏覽器收到後,從緩存裏讀出內容;有修改的話,返回200 OK,並返回新的內容。這種情況,就像你找到一盒已經過期的牛奶,於是問別人,還能不能喝,如果別人說可以,你就把它喝了,如果別人說不行,那你得就另外找一盒新鮮的牛奶。
至於F5刷新,其HTTP請求消息頭如下:
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
又多了一行Cache-Control: max-age=0,意思是說,我不管瀏覽器緩存中的文件過期沒有,都去服務器詢問一下,相當於上次HTTP響應的Expires暫時失效。服務器的響應 處理流程同上。這種情況,就像你找到一盒牛奶,沒有看它的有效期,直接就問別人能不能喝。
最後是Ctrl+F5刷新,其HTTP請求消息頭如下:
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沒有了,Cache-Control換成了no-cache,此外Pragma行是為了兼容HTTP1.0,作用與 Cache-Control: no-cache是一樣的。意思是,我不要緩存中的文件了,強制刷新,直接到服務器上重新下載,於是服務器的響應處理與首次請求這個URI一樣,返回 200 OK和新的內容。這種刷新,使用的網絡流量是最大的,也是最耗時的。這就像你雖然發現了一盒牛奶,但是把它扔掉了,直接去買一盒新的。
所以,當利用頁面上的隱藏域value時,有可能在頁面的操作時更改了該隱藏域的值,所以(按鈕)刷新瀏覽器時,隱藏域的value是不會恢復到初始值,所以應在文檔加載完成
$(document).ready(function () {
//初始化菜單隱藏域
$("#menu_value").val(1);
}。
而不能依賴
<input id="menu_value" value="1" type="hidden"/>
瀏覽器中回車(Enter)和刷新的區別是什麽?[轉載]