轉載：Tomcat發佈項目時，瀏覽器地址欄圖標的問題

時間 2019-12-05

原文原文鏈接

最近在作一個java網絡應用程序，服務器是tomcat。在默認狀況下，當用戶訪問該網絡應用時，地址欄圖標顯示爲 tomcat貓。我但願把它換成本身的圖標，因而研究了一下。在研究過程當中，我發現網上的資料大都語焉不詳，因而把本身的研究結果分享出來。本文的測試環境爲：java

tomcat 6.0.20
IE6 SP3
Firefox 3.6.13
搜狗高速瀏覽器 2.2.0
360安全瀏覽器 3.6.1
傲遊瀏覽器 2.5.17web

首先說明一下，我這個程序的用戶通常使用的是基於IE6內核的外殼瀏覽器，好比搜狗高速瀏覽器、360安全瀏覽器和傲遊瀏覽器等，也有少數的用戶使用Firefox，因此我測試的瀏覽器主要就是這幾款瀏覽器。至於其它的數得上號的瀏覽器，我猜本文提供的方法也可以大致上適用。不過這也僅僅是猜想，若是說得不對，還請見諒或者指出。瀏覽器

下面分析一下各個瀏覽器對於地址欄圖標的緩存機制。爲何要分析這個呢？由於在大多數狀況下，若是不清空地址欄圖標的緩存，那麼即便改變了服務器端設置的地址欄圖標，在瀏覽器端也不會馬上反映出來，這就給測試帶來了困難。而瀏覽器們對於地址欄圖標的緩存機制又不盡相同，所以有必要逐個加以分析。緩存

IE6和Firefox的緩存機制相對簡單，即地址欄圖標與其它須要緩存的數據存放在同一位置，所以通常的清空緩存操做對地址欄圖標一樣適用。可是，基於IE內核的三款瀏覽器卻把地址欄圖標與其它須要緩存的數據分開存放，必須使用手動的方法進行清除。tomcat

搜狗高速瀏覽器把地址欄圖標緩存在用戶目錄下的Application Data/SogouExplorer/FavIcon文件夾中，其中主要起做用的是FavorIcon.db這個文件，此外還有一系列叫作s*.ico 的文件，這些文件是在「最常訪問欄」等處用到的圖標文件。清空搜狗高速瀏覽器的地址欄圖標的緩存較爲麻煩，由於FavorIcon.db文件彷佛必須在搜狗高速瀏覽器關閉的狀況下才能刪除，所以推薦的方法是，在搜狗高速瀏覽器的「隱私保護」那裏把全部緩存數據都刪除，而後關閉搜狗高速瀏覽器，再把 FavIcon文件夾中的全部文件都刪除（清空緩存數據後，搜狗高速瀏覽器的「最常訪問欄」等處也被清空了，因此那些s*.ico也就沒用了）。而後再打開搜狗高速瀏覽器，這樣就算是清空了地址欄圖標的緩存。安全

360安全瀏覽器又是另外一種狀況。它把地址欄圖標緩存在用戶目錄下的Application Data\360se\data\ico文件夾中，以「站點名.ico」爲名保存起來。因此只要找到對應的ico文件，刪除了就能夠了。可是有一點須要注意，假如站點名包含端口信息，好比「127.0.0.1:8080」，那麼它的緩存文件就會是一個空文件，並且瀏覽器也只會在地址欄裏顯示默認的綠e圖標。我猜這是360安全瀏覽器的某種bug，由於在Windows系統下文件名裏是不能含有冒號的，因此說不定就是這樣。而不包含端口信息的站點，也就是端口爲默認的80的站點，好比「127.0.0.1」，是不存在這樣的問題的。服務器

傲遊瀏覽器把地址欄圖標緩存在安裝目錄的Favicons文件夾中，可是文件名是自動生成的。若是你能找到對應的文件，那麼刪除了就能夠了。若是找不到或者懶得找，那麼把Favicons文件夾中的全部文件都刪除了也就是了。網絡

除了清空瀏覽器的地址欄圖標的緩存之外，還有一種辦法能夠繞過這個問題，那就是改變tomcat的服務端口而後重啓tomcat。在測試過程當中，這個辦法能夠同時對付多個瀏覽器，因此仍是比較方便的。只不過因爲上面說起的緣由，這個辦法不能很好地兼顧360安全瀏覽器。app

下面進入正題，如何替換tomcat的貓圖標。我首先嚐試的方法是在應用程序的web.xml里加入這麼一段：webapp

<icon>
<small-icon>/images/small.gif</small-icon>
<large-icon>/images/large.gif</large-icon>
</icon>

其中/images/small.gif和/images/large.gif是我製做的兩個gif文件，大小分別爲16×16像素和32×32像素。可是這個方法無論用，緣由不知道。若有知道的兄者，還請賜教。

而後我又進行了各類各樣的嘗試，發現了兩種管用的方法。這兩種方法各有利弊。

方法一，修改整個tomcat的配置。

首先製做一個名爲favicon.ico的圖標文件，而後進入tomcat的webapps下的ROOT目錄，把其中的favicon.ico替換成本身的。注意如下幾點：

1. favicon.ico應該爲16×16像素或32×32像素，8位色（256色）或24位色。

2. 聽說favicon.ico有大小的限制，上限爲1.22K[?]。不過據我觀察，超過1.22K也不要緊。好比Firefox官方網站上的favicon.ico大小爲2.49K，我保存下來放到tomcat的webapps下的ROOT目錄裏，也能正常顯示。

3. 聽說須要修改tomcat的conf下的web.xml，在其中加入這麼一段：

<mime-mapping>
<extension>ico</extension>
<mime-type>image/x-icon</mime-type>
</mime-mapping>

其實這段的主要做用在於當用戶經過瀏覽器請求後綴名爲.ico的資源時，tomcat告知瀏覽器該資源的媒體類型，以指導瀏覽器適當地在顯示區域展示該資源。而對於地址欄的圖標數據，即便不特別指定媒體類型，瀏覽器應該也有能力處理。反正據我觀察，加不加這段話對於地址欄圖標的顯示來講效果是同樣的。

4. 聽說除了覆蓋favicon.ico之外，還要把同目錄下的tomcat.svg也搞掉。不過據我觀察，搞不搞掉它效果是同樣的。

使用這個方法後，各個瀏覽器的顯示效果以下：
@ IE6只在地址欄顯示那個一如既往的e圖標，可是保存到收藏夾後能夠看到效果。實際上，當訪問百度之類的網站時，IE6也不在地址欄那裏顯示百度的圖標，所以我也不期望能比百度作得更好。
@ Firefox在地址欄顯示更改後的圖標。
@ 搜狗高速瀏覽器在地址欄顯示更改後的圖標。
@ 360安全瀏覽器在地址欄顯示更改後的圖標。
@ 傲遊瀏覽器在地址欄顯示更改後的圖標。

方法二，修改應用程序的頁面。

在每一個顯示在頂層窗口的網頁裏的<head></head>里加入這麼一段：

注意如下幾點：

1. 有人說href必須是絕對路徑，其實不必。相對路徑同樣OK。並且文件名不必定是favicon.ico，能夠自由地命名。並且也不必定是本地路徑，任何可用的路徑均可以，好比http://www.mozilla.com/favicon.ico。

2. 聽說rel="shortcut icon"表明地址欄圖標，rel="bookmark"表明收藏夾圖標。不過彷佛也不能一律而論，好比對於Firefox來說，rel="shortcut icon"是表明地址欄圖標沒錯，rel="icon"倒是在收藏夾裏起做用的那一個，rel="bookmark"不起任何做用。可是對於其它瀏覽器來說狀況又有所不一樣，因此比較穩當的作法是把這三個都寫上，而後指向同一個文件。

3. 聽說須要修改tomcat的web.xml或者應用程序的web.xml，在其中加入這麼一段：

<mime-mapping>
<extension>ico</extension>
<mime-type>image/x-icon</mime-type>
</mime-mapping>

不過據我觀察，應該也是用不着。

使用這個方法後，各個瀏覽器的顯示效果以下：
@ IE6，地址欄顯示e圖標，收藏夾顯示更改後的圖標。
@ Firefox在地址欄顯示更改後的圖標。
@ 搜狗高速瀏覽器在地址欄顯示tomcat貓。
@ 360安全瀏覽器在地址欄顯示tomcat貓。
@ 傲遊瀏覽器在地址欄顯示更改後的圖標。

換一種說法，搜狗高速瀏覽器和360安全瀏覽器只買方法一的帳，其它三款瀏覽器既買方法一的帳也買方法二的帳。若是同時使用方法一和方法二，則方法二的優先級更高（由於tomcat貓就是方法一的默認圖標）。

這兩種方法各有千秋。我比較喜歡方法一，理由是簡單方便，並且測試全數經過。缺點是修改了整個tomcat的配置，影響了其中運行的全部應用程序的地址欄圖標。不過若是這些應用程序原本就應該使用同一地址欄圖標的話（好比某家公司的所有應用程序都使用該公司的logo做爲圖標），那就不成爲問題。方法二的主要問題在於不被搜狗高速瀏覽器和360安全瀏覽器所支持，並且須要改動全部顯示在頂層窗口的頁面，有些麻煩。不過我以爲方法二表明了地址欄圖標的發展方向，雖然目前不被搜狗高速瀏覽器和360安全瀏覽器所支持，可是說不定未來就會被支持。並且雖然要改動不少頁面是有點麻煩，不過只拷貝幾行代碼的話，其實也算不了什麼。何況方法二有一個很大的優勢，就是能夠在不影響其它應用程序的狀況下改動tomcat中的某個應用程序，這點是方法一所不具有的。

原文地址：http://hi.baidu.com/hebo_thu/item/fc8c81bb164f5cee4fc7fd90（密技摘錄，僅做備份）