キャッシュを比較 (ネゴシエート)
キャッシュを使用するか、データを再フェッチするかを比較して決定します。これにより、ネットワーク リクエストが削減され、パフォーマンスが向上します。
コントラスト キャッシュの仕組み
クライアントが初めてサーバーをリクエストすると、サーバーはデータをキャッシュし、クライアントに送信されるキャッシュ識別子を生成します。クライアントがサーバーを 2 回目にリクエストすると、キャッシュ識別子は文字として送信されます。サーバー、サーバーはキャッシュ識別子に従って判断します。キャッシュ識別子が同じ場合、サーバーはキャッシュが期限切れかどうかを判断します。そうでない場合、サーバーは 304 を返し、クライアントにキャッシュを使用するように指示します。キャッシュ識別子が異なる場合、サーバーは 200 を返し、同時に新しいデータを返します。
前のセクションでは変更時刻メソッドを使用しましたが、このセクションではコンテンツを使用して処理します。
md5 ダイジェスト アルゴリズムを使用します。暗号化アルゴリズムではありません (不可逆的)
- 不可逆
- 異なるコンテンツの変換結果は同じではありません
- 変換結果はすべて同じ長さです
- 同じことは同じ結果を生みます
- 雪崩効果、少しの違いが大きな違いを生む
使用されるライブラリは暗号ライブラリです
const crypto = require('crypto');
console.log(crypto.createHash('md5').update('kaimo313').digest('base64'));
// rFDqro5Lox3vFXr5fA4r7Q==
- クライアント:
if-none-match
- サーバー:
ETag
現在のファイルの一意の識別子
ETag + if-none-match
比較キャッシュが実現でき、比較方法がより正確になります。欠点は、ファイルが非常に大きい場合にパフォーマンスが低下することですが、デフォルトではコンテンツ全体とコンテンツの特定の部分に対してハッシュ スタンプを生成しません。正確性を確保するために、コンテンツの一部を追加することもできますが、上記のファイルの合計サイズを使用してハッシュ スタンプを生成するため、パフォーマンスが大幅に向上します。
新しいビルドcache.js
const http = require("http");
const fs = require("fs");
const path = require("path");
const url = require("url");
const crypto = require("crypto");
const server = http.createServer((req, res) => {
const {
pathname } = url.parse(req.url);
const filePath = path.join(__dirname, pathname);
console.log(req.headers);
res.setHeader("Cache-Control", "no-cache");
// 拿到客户端传过来的 if-none-match 文件标识
let ifNoneMatch = req.headers["if-none-match"];
fs.stat(filePath, (err, statObj) => {
if (err) return res.end();
// 进行文件摘要产生hash
let contentHash = crypto.createHash("md5").update(fs.readFileSync(filePath)).digest("base64");
if (ifNoneMatch === contentHash) {
res.statusCode = 304;
return res.end();
}
res.setHeader("ETag", contentHash);
// 第一请求,需要根据内容生成一个唯一的标识:可以对应当前的文件
if (err) return (res.statusCode = 404), res.end("Not Found");
// 判断是否是文件
if (statObj.isFile()) {
fs.createReadStream(filePath).pipe(res);
} else {
res.statusCode = 404;
res.end("Not Found");
}
});
});
server.listen(5000);
次に、新しいパブリック フォルダーを作成し、追加しますindex.html
。style.css
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>凯小默测试对比缓存:通过内容</title>
</head>
<body>
<link rel="stylesheet" href="/public/style.css">
</body>
</html>
body {
background-color: seagreen;
}
サービスを開始し、 にアクセスするhttp://127.0.0.1:5000/public/index.html
と、2 回目に要求されたリソースが 304 になることがわかります。
nodemon cache.js