快取是前端面試的乙個常見知識點，下面對於實際專案中如何進行快取的設定給出方案。
強快取和協商快取
瀏覽器快取是瀏覽器將使用者請求過的靜態資源儲存到電腦本地磁碟中，當再次訪問時，就可以直接從本地快取中載入而不需要去向伺服器請求了。但是快取也有缺點，如果服務端資源更新了，客戶端沒有強制重新整理的情況下，看到的內容還是舊的。所以，前端需要根據專案中各個資源的實際情況，做出合理的快取策略。這就出現了強快取和協商快取。
強快取：通過http的response header中的cache-control和expire兩個字段控制。其中expire基本上已經淘汰了，不用管，主要看cache-control的幾個取值含義：
private：僅瀏覽器可以快取
public：瀏覽器和**伺服器都可以快取
max-age=***：過期時間
no-cache：不進行強快取
no-store：不強快取，也不協商快取
強快取步驟：1，第一次請求檔案時，快取中沒有該資訊，直接請求伺服器。
2，伺服器返回請求的檔案，並且http response header中cache-control為max-age=***
3，再次請求該檔案時，判斷是否過期，如果沒有過期，直接讀取本地快取，如果已經過期了，則進行協商快取。
協商快取：它的觸發條件有兩點，其一是cache-control 的值為 no-cache，其二是max-age 過期了。協商快取中還有兩個重要的規則：
etag：每個檔案有乙個，改動檔案了就變了
last-modified：檔案的修改時間
協商快取步驟：1，請求資源時，要同時比較本地該資源的etag和last-modified(主要是etag)和伺服器最新資源該資源的etag
2，如果資源沒有被更新，返回304狀態碼，瀏覽器讀取本地快取
3，如果資源已經被更新，返回200狀態碼，瀏覽器獲取伺服器最新資源。
最大的問題就是每次都要向伺服器驗證一下快取的有效性，但是這就使快取失去了意義。
所以，給出乙個比較合理的快取方案：
html：使用協商快取
css&js&：使用強快取
etag計算
nginx
nginx官方預設的etag計算方式是為"檔案最後修改時間16進製制-檔案長度16進製制"。例：etag： 「59e72c84-2404」
express
express框架使用了serve-static中介軟體來配置快取方案，其中，使用了乙個叫etag的npm包來實現etag計算。
後端需要怎麼設定
以nodejs為例，如果需要瀏覽器強快取，可以這樣設定：
res.setheader('cache-control', 'public, max-age=***');
如果需要協商快取，則可以這樣設定：
res.setheader('cache-control', 'public, max-age=0');
res.setheader('last-modified', ***);
res.setheader('etag', ***);
前端強快取和協商快取
快取是前端面試的乙個常見知識點，下面對於實際專案中如何進行快取的設定給出方案。瀏覽器快取是瀏覽器將使用者請求過的靜態資源儲存到電腦本地磁碟中，當再次訪問時，就可以直接從本地快取中載入而不需要去向伺服器請求了。但是快取也有缺點，如果服務端資源更新了，客戶端沒有強制重新整理的情況下，看到的內容還是舊的。...
強快取 協商快取
強快取 客戶端第一次向伺服器請求資源時，伺服器返回某個資源的同時，新增某些頭部資訊，告訴客戶端將資源儲存在本地，並在未來的某個時點之前再次請求這個資源時，直接從本地獲取就可以了。字段控制 瀏覽器再次請求這個資源時，會先從快取中找到這個資源，然後獲取expires時間與當前的請求時間比較，如果expi...
強快取和協商快取
對於一次已經有快取存在的請求來說 即之前已經發過針對這個資源的請求，在本地已經有快取 如果發起請求，那麼 首先會去找到快取資源的響應頭中的expires 過期時間 和cache control 控制快取的失效性 來判斷當前是否直接使用快取，如果當前時間還在expires之前，即快取仍未失效的情況下，...