将favicon添加到JSF项目中，并在中引用

How do I add a favicon to a JSF project and reference it in <link> element?

如何将一个favicon添加到一个JSF项目中，并在元素中引用它?

I tried as below:

我尝试了如下:

<h:head>
    <link rel="icon" type="image/x-icon" href="images/favicon.ico"/>
    ...
</h:head>

However, it didn't show any favicon.

然而，它并没有显示出任何偏袒。

4 个解决方案

#1

A relative href is relative to the current request URI. Likely it resolved to an invalid URL. You need to prepend with the context path so that it becomes relative to the domain root.

相对href是相对于当前请求URI的。它可能解析为无效的URL。您需要使用上下文路径作为前缀，以便它相对于域根。

Also, the rel has better to be shortcut icon to get it to work in older browsers too.

而且，rel也最好是快捷图标，以便在旧的浏览器中使用。

In case of using an .ico file, you also need to ensure that it's a real .ico file and not some .bmp renamed to .ico. You can generate one here based on several image formats. You can however also just use a .png or .gif file.

在使用.ico文件时，您还需要确保它是一个真正的.ico文件，而不是一些.bmp重命名为.ico的文件。您可以在这里基于几个图像格式生成一个。不过，您也可以使用.png或.gif文件。

All in all, provided that the file is located in

总之，只要文件位于

WebContent
 |-- images
 |    `-- favicon.ico
 :

then this should do it:

这样就可以做到:

<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/images/favicon.ico"/>

If you've however placed it as a JSF resource in the /resources folder as follows

如果您将它作为JSF资源放在/resources文件夹中，如下所示

WebContent
 |-- resources
 |    `-- images
 |         `-- favicon.ico
 :

which would make it accessible by <h:graphicImage name="images/favicon.ico">, then this should do it:

这使得它可以通过，那么这个应该可以做到:

<link rel="shortcut icon" type="image/x-icon" href="#{resource['images/favicon.ico']}"/>

#2

I used the following and it works in both IE and Chrome

我使用了下面的方法，它在IE和Chrome中都有效果。

<link rel="shortcut icon" href="#{resource['images/favicon.ico']}" type="image/x-icon" />

#3

As a side note, I always include both of these when referencing a favicon:

作为补充说明，在引用favicon时，我总是把这两个都包括在内:

<link rel="shortcut icon" type="image/x-icon" href="https://a.staticimageserver.com/img/favicon.ico" />
<link rel="icon" type="image/x-icon" href="https://a.staticimageserver.com/img/favicon.ico" />

#4

Since JSF uses the resources as a container for storing the image file folder, you can do the following;

由于JSF将资源用作存储映像文件文件夹的容器，您可以执行以下操作;

<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/resources/images/favicon.ico"/>

#1