您好,登錄后才能下訂單哦!
本文小編為大家詳細介紹“用node如何實現緩存”,內容詳細,步驟清晰,細節處理妥當,希望這篇“用node如何實現緩存”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。
瀏覽器緩存的基本原理是將靜態資源(如 CSS、JavaScript、圖片等)緩存到本地,當頁面再次請求這些資源時,直接從本地獲取,而不是重新從服務器下載。這可以減少頁面的加載時間和減輕服務器負擔,提高用戶體驗。
在 HTTP 協議中,瀏覽器緩存可以通過兩種機制實現:強緩存和協商緩存。
Expires字段:
值為服務端返回的到期時間,可能因為服務端和客戶端時間不同而造成緩存命中誤差
Cache-Control(替代方案)
public:所有內容都被緩存(客戶端和代理服務器都可被緩存)
private:只緩存到私有緩存中(客戶端)
no-cache:與服務端確認返回的響應是否被更改,然后才能使用該響應來滿足后續對同一個網址的請求。因此,如果存在合適的驗證令牌 (ETag),no-cache 會發起往返通信來驗證緩存的響應,如果資源未被更改,可以避免下載。
no-store:值不緩存
must-revalidation/proxy-revalidation:如果緩存內容失效,則請求必須發送到服務器已進行重新驗證
max-age=xxx:緩存內容在xxx秒后失效,這個選項只能在http1.1使用, 比last-Modified優先級更高
last-Modified(上次修改日期)
last-Modified:保存于服務器中,記錄該資源上次修改的日期(不能精確到秒,如果在數秒內多次修改,可能會導致錯誤命中緩存)
if-modified-since:保存于客戶端中,請求被攜帶并與服務端的last-Modified比較,相同則直接命中緩存返回304狀態碼
const Koa = require('koa');
const app = new Koa();
// 設置 expires方案
const setExpires = async (ctx, next) => {
// 設置緩存時間為 1 分鐘
const expires = new Date(Date.now() + 60 * 1000);
ctx.set('Expires', expires.toUTCString());
await next();
}
// Cache-Control方案(優先執行)
const setCacheControl = async (ctx, next) => {
// 設置緩存時間為 1 分鐘
ctx.set('Cache-Control', 'public, max-age=60');
await next();
}
// Last-Modified方案
const setLastModified = async (ctx, next) => {
// 獲取資源最后修改時間
const lastModified = new Date('2021-03-05T00:00:00Z');
// 設置 Last-Modified 頭
ctx.set('Last-Modified', lastModified.toUTCString());
await next();
}
const response = (ctx) => {
ctx.body = 'Hello World';
}
// 跟Last-Modified方案相對應
const lastModifiedResponse = (ctx) => {
// 如果資源已經修改過,則返回新的資源
if (ctx.headers['if-modified-since'] !== ctx.response.get('Last-Modified')) {
response(ctx)
} else ctx.status = 304;
}
app.get('/getMes', setExpires, response);
app.listen(3000, () => console.log('Server started on port 3000'));
Etag/if-None-Match
Etag:服務器根據請求的資源計算一個哈希值(也可以是其他算法,代表一個資源標識符) 并返回給瀏覽器,下次瀏覽器請求該資源時通過if-None-Match字段將Etag發送給服務器
Last_Modified和if-Modified-Since
last-Modified:保存于服務器中,記錄該資源上次修改的日期(不能精確到秒,如果在數秒內多次修改,可能會導致錯誤命中緩存)
if-modified-since:保存于客戶端中,請求被攜帶并與服務端的last-Modified比較,相同則直接命中緩存返回304狀態碼
ETag 是服務器為資源分配的唯一標識符,而 Last-Modified 是服務器報告的資源的最后修改時間。
ETag 可以使用任何算法生成,例如哈希,而 Last-Modified 只能使用特定的時間格式(GMT)。
ETag 的比較是強驗證器(exact-match validator),需要完全匹配,而 Last-Modified 的比較是弱驗證器(weak validator),只需要在同一秒鐘內相同即可。
ETag 適用于所有類型的資源,而 Last-Modified 只適用于不常更改的資源,例如圖片、視頻等。
對于經常更新的資源,ETag 更適合,因為它可以更準確地檢測資源是否已經被修改;而對于不經常更新的資源,Last-Modified 更適合,因為它可以減少服務器負載和網絡流量。
const Koa = require('koa');
const app = new Koa();
// 設置 eTag方案
const setExpires = async (ctx, next) => {
// 設置緩存時間為 1 分鐘
const maxAge = 60;
ctx.set('Cache-Control', `public, max-age=${maxAge}`);
// 設置 ETag 頭
const etag = 'etag-123456789';
ctx.set('ETag', etag);
await next();
}
// Last-Modified方案
const setLastModified = async (ctx, next) => {
// 設置緩存時間為 1 分鐘
const maxAge = 60;
ctx.set('Cache-Control', `public, max-age=${maxAge}`);
// 設置 Last-Modified 頭
const lastModified = new Date('2021-03-05T00:00:00Z');
ctx.set('Last-Modified', lastModified.toUTCString());
await next();
}
const response = (ctx) => {
ctx.body = 'Hello World';
}
// 跟Etag方案對應
const etagResponse = (ctx) => {
// 如果 ETag 頭未被修改,則返回 304
if (ctx.headers['if-none-match'] === ctx.response.get('ETag')) {
ctx.status = 304;
} else ctx.body = 'Hello World';
}
// 跟Last-Modified方案相對應
const lastModifiedResponse = (ctx) => {
// 如果資源已經修改過,則返回新的資源
if (ctx.headers['if-modified-since'] !== ctx.response.get('Last-Modified')) {
response(ctx)
} else ctx.status = 304;
}
app.get('/getMes', setExpires, response);
app.listen(3000, () => console.log('Server started on port 3000'));
const Koa = require('koa');
const crypto = require('crypto');
const app = new Koa();
// 假設這是要緩存的資源
const content = 'Hello, world!';
app.use(async (ctx) => {
// 計算資源的哈希值
const hash = crypto.createHash('md5').update(content).digest('hex');
// 設置 ETag 頭
ctx.set('ETag', hash);
// 判斷客戶端是否發送了 If-None-Match 頭
const ifNoneMatch = ctx.get('If-None-Match');
if (ifNoneMatch === hash) {
// 如果客戶端發送了 If-None-Match 頭,并且與當前資源的哈希值相同,則返回 304 Not Modified
ctx.status = 304;
} else {
// 如果客戶端沒有發送 If-None-Match 頭,或者與當前資源的哈希值不同,則返回新的資源
ctx.body = content;
}
});
app.listen(3000);
強緩存未失效,從緩存中讀取數據,cache-control優先級高于last-Modified
強緩存失效,執行協商緩存,Etag的優先級會高于last-Modified
緩存未失效服務器返回304狀態碼,客戶端從緩存中讀取數據
緩存已失效則返回資源和200狀態碼
強緩存通常在瀏覽器中緩存靜態資源(如 CSS、JavaScript、圖片等),以減少頁面的加載時間和減輕服務器負擔。
協商緩存通常用于緩存動態資源(如 HTML 頁面、API 數據等),以減少服務器的負擔和網絡帶寬的消耗。
在實際應用中,強緩存和協商緩存可以單獨使用或一起使用。對于一些靜態資源,可以只使用強緩存;對于一些動態資源,可以只使用協商緩存;對于一些經常變化的資源,可以使用強緩存和協商緩存結合使用,既可以減少服務器的負擔,也可以保證及時獲取到最新的資源。
讀到這里,這篇“用node如何實現緩存”文章已經介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。