節點的js，瀏覽器緩存和304響應

我設計一個單頁的應用程序與普通的HTML佈局，像這樣：節點的js，瀏覽器緩存和304響應

<html> 
    <head> 
    <title>...</title> 
    <link rel="stylesheet" media="all" type="text/css" href="css/main.css"> 
    ...more meta tags 
    </head> 
    <body> 
    <!--body generated with templates--> 
    <script src="js/main.js"></script> 
    </body> 
</html>

在Node.js的服務器：

route.get(req, function(url, type, hdr) { 
    if (type === 'error') { 
    //response 404 
    }else if (type === 'page') { 
    console.log(url); 
    fileSys.stat(url, function(err, stat) { 
     if (err) { 
     res.statusCode = 404; 
     res.setHeader("Content-Type","text/plain"); 
     res.write("404 Not Found"); 
     res.end(); 
     }else { 
     var file, 
     headers = {}, 
     modif = req.headers['if-modified-since']; 
     if (modif && new Date(modif).getTime() === stat.mtime.getTime()) { //STATUS 304 
      headers = { 
      'Last-Modified': stat.mtime.toUTCString(), 
      'Date': new Date().toUTCString() 
      }; 
      res.writeHead(304, headers); 
      res.end(); 
     }else { //STATUS 200 
      if (path.extname(url) === '.jpg' || path.extname(url) === '.png') 
      file = fileSys.readFileSync(url); 
      else { 
      if (fileSys.statSync(url).isDirectory()) 
       url += '/index.html'; 
      file = fileSys.readFileSync(url, 'binary'); 
      } 
      headers = { 
      'Last-Modified': stat.mtime.toUTCString(), 
      'Content-Length': stat.size, 
      'Cache-Control': 'public, max-age=31536000', 
      'ETag': url+'_'+stat.mtime.getTime(), 
      'Date': new Date().toUTCString() 
      }; 
      var contentType = contentExtens[path.extname(url)]; 
      if (contentType) 
      headers['Content-Type'] = contentType; 
      res.writeHeader(200, headers); 
      res.end(file); 
     } 
     } 
    }); 
    } 
});

我處理沒有Express的路由和我遇到的問題是在清除我的Chrome緩存後，我刷新了我的索引頁和服務器端我記錄了所有記錄索引頁，css，js，favicon和所有的請求圖像。但是當我重新加載索引頁時，唯一需要的索引是沒有資源的索引頁。在瀏覽器控制檯中，一切都是304並從緩存中加載。這是正常的行爲嗎？如果我對圖像或任何資源文件進行了一些更改，我無法比較mtime，因爲這些請求沒有發送。

另外我在Safari上注意到，即使在設置緩存，上次修改和etag標頭後，所有資源都會被髮送。我不明白這應該如何工作，這是一個瀏覽器的東西，或者我做錯了什麼？

來源

2017-05-29 denikov

我並不完全理解緩存在瀏覽器上的工作原理，直到我閱讀了this article，它讓我看到了我將所有內容緩存一年的事實。主頁面每次都被請求，但是頁面的資源被緩存了一年，並且直到用戶清除緩存或者一年之後纔會被請求。因此，解決方案是將Cache Control設置爲no-cache，並將ETag設置爲某個值。在這種情況下，將發送每個資源的請求，並由您來決定是否修改了任何內容。或者繼續緩存很長一段時間，但無論何時您修改資源，在index.html頁面（例如：main.V4.js或mycss.x845.css）中追加一些值。瀏覽器將遇到這個新的文件名併發送一個新的請求。

希望這可以幫助某人，如果我有什麼問題，請添加一些東西！

來源

2017-06-03 17:58:43 denikov

節點的js，瀏覽器緩存和304響應

回答

相關問題