緩存差異是“ /image.png”和“ /image.png?xyz”嗎？

Question

我們需要推送一個在.css文件中多次引用的Sprite的新版本，因此我認為我應該在文件名后附加一個模擬查詢字符串。 但是，一位同事聲稱，只要在“？”之前的所有內容都只需更改第一個引用即可。 保持原樣。 我很難相信，但是他正確嗎？

我會這樣做：

.class1 {
    background-image:url(/path/sprite.png?xyz=123);
}

.class2 {
    background-image:url(/path/sprite.png?xyz=123);
}

他聲稱您可以這樣做：

.class1 {
    background-image:url(/path/sprite.png?xyz=123);
}

.class2 {
    background-image:url(/path/sprite.png);
}

根據我的同事的說法，這將導致兩個類使用相同的文件，因為新版本的sprite.png將在class1中的引用之后被緩存。

Answer 1

我以前使用過這種技術。 最好使用Apache來控制緩存。 mod_expires是研究如何實現此目標的好地方。 圖像標題說明其到期時間。

編輯

已確認。 向圖像添加查詢字符串會將精靈推向用戶。 危險在於，它可能導致特定圖像永遠不會被緩存，具體取決於瀏覽器。 這可能會導致網站加載速度低於所有圖像或大背景圖像所使用的加載速度。

我可以確認，每次訪問站點時，Firefox都會始終提取圖像。