如何在追蹤圖像變化的同時利用圖像緩存？

在我的一個網站上，我只是將我的用戶圖像作爲'1.jpg'存儲在他們的用戶文件夾中。這意味着，只要他們改變他們的個人資料圖片，文件名保持不變。如何在追蹤圖像變化的同時利用圖像緩存？

我一直想要利用圖像緩存，以便每當用戶的配置文件被查看和重新查看時，同樣的舊圖片不會一遍又一遍地下載，但同時我希望我的用戶的瀏覽器下載新的，如果它已經改變。

我怎麼能在PHP中做到這一點？

2012-07-20 ProgrammerGirl

在這裏回答：http://webmasters.stackexchange.com/questions/32481/is-it-worth-it-to-change-my-entire-user-images-file-structure-to-take-advantage – ProgrammerGirl 2012-07-23 15:48:36

在這裏找到答案：https://webmasters.stackexchange.com/questions/32481/is-it-worth-it-to-change-my-entire-user-images-file-structure-to-take-advantage

一個常用的解決辦法是讓你的圖片網址是這個樣子：

http://www.example.com/path/to/images/1.jpg?v=123456

這裏，/path/to/images/1.jpg是圖片的實際URL路徑，而?v=123456僅僅是一個虛擬查詢，凝視着URL的末尾。查詢字符串可以是任何東西—版本號，時間戳，圖像內容的哈希值，只要您在圖像更改時更改它，並在不更改圖像時保持不變。

訣竅是，Web服務器在被要求提供這樣一個URL時，將忽略查詢字符串，因爲URL實際上指向一個靜態文件。但是對於用戶的瀏覽器（以及中間的任何代理），具有不同查詢字符串的URL將完全不同，因此對查詢字符串的任何更改都會強制瀏覽器重新加載文件。

因此，您可以配置您的Web服務器以發送Expires和Cache-Control HTTP頭以允許無限制緩存，這是安全的，您可以通過更改查詢字符串來強制重新加載。要做到這一點的方法之一，如果你使用Apache與mod_expires，是把一個.htaccess文件圖像目錄中的臺詞：

ExpiresActive On 
ExpiresDefault "access plus 1 year"

這種技術被許多受歡迎的網站。例如，如果你看一下這個非常網頁的HTML源代碼，你會發現，它的樣式表是從URL加載像這樣：

http://cdn.sstatic.net/stackoverflow/all.css?v=7cd8ea9d6f1e

這裏，?v=7cd8ea9d6f1e是一個虛擬的查詢字符串只像我上面描述的那樣;你可以通過改變它並確認它確實仍然返回相同的文件來確認。

來源

2012-07-23 15:49:38 ProgrammerGirl

最簡單的修復方法是爲每個用戶的配置文件選擇一個隨機名稱GUID.jpg。每當他們改變他們的個人資料圖片分配給他們一個新的GUID。

現在你可以服務這個配置文件圖片與指示客戶端永久緩存它。

來源

2012-07-20 17:43:26

那我不就必須跟蹤上傳的每一張照片嗎？我在哪裏/如何存儲隨機名稱？現在，我知道在哪裏可以找到/呼叫每個用戶的個人資料圖片，因爲這只是他們的用戶文件夾/ 1.jpg。 – ProgrammerGirl 2012-07-20 18:08:37

每張照片都會轉到他們的個人資料文件夾，但會獲得一個隨機名稱。您可以清除配置文件夾中較舊的照片，或者只返回最後創建的照片。 – 2012-07-20 18:12:57

問題在於它們允許上傳多個圖片，那麼我將如何跟蹤所有這些隨機文件名，以及哪些屬於哪些用戶？ – ProgrammerGirl 2012-07-20 18:14:40

電子標籤，最後修改的基本標題，使瀏覽器能夠決定資源（即配置文件圖片）是否發生了變化，是否從服務器下載或從緩存中檢索它。

可能我建議使用php來調用圖片而不是直接鏈接它？

<?php $lmt = filemtime($_GET['file']); $etag = md5($lmt); header('Content-type: application/x-javascript'); header("Cache-Control: max-age=3600"); header("Last-Modified: ".gmdate("D, d M Y H:i:s", $lmt)." GMT"); header("ETag: ".'"'.$etag.'"'); if(@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE']) == $lmt || trim($_SERVER['HTTP_IF_NONE_MATCH']) == $etag) { header("HTTP/1.1 304 Not Modified"); exit; } ?>

內容，然後會被加載下面這段代碼段

來源

2012-07-20 17:44:55

如何在追蹤圖像變化的同時利用圖像緩存？

回答

相關問題