转载：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（密技摘录，仅做备份）