如何使用 JSF/OmniFaces/PrimeFaces 嵌入 SVG 图像？

Question

这是我想要做的：

1. 我有一个@ViewScopedJSF bean，我在其中使用 Jersey 调用 JAX-RS 服务。
2. 我请求的资源返回 content-type 的响应image/svg+xml。
3. 在 Facelet 页面中显示它。

到目前为止，我的研究使我相信：

• h:graphicImage （核心 JSF）不支持 SVG
• p:graphicImage (PrimeFaces) 不支持 SVG
• o:graphicImage (OmniFaces) 也不支持 SVG。

有没有办法从支持 bean 将 SVG 图像传送到 facelets 页面？服务 SVG 图像的服务将在稍后扩展以支持交付（以及其他格式）PNG，但我希望直接使用 SVG。

Answer 1

在<o:graphicImage>设置默认内容类型的image，但您的浏览器显然没有吞下了SVG图像。根据此提交，我为 OmniFaces 2.1 添加了 SVG 支持，<o:graphicImage dataURI="true">并且添加了一个新type属性，允许您通过文件扩展名明确指定图像类型：

<o:graphicImage value="#{bean.image}" type="svg" />

如果它抛出IllegalArgumentException这样的

java.lang.IllegalArgumentException: o:graphicImage 'type' 属性必须表示有效的文件扩展名。遇到无效的“svg”值。

那么这意味着您的服务器无法将其识别为已注册的 MIME 映射。然后，您应该添加一个新的 mime 映射到服务器或 webapp web.xml，如下所示：

<mime-mapping>
    <extension>svg</extension>
    <mime-type>image/svg+xml</mime-type>
</mime-mapping>