通过 h:outputScript 将 javascript 包含在资源中

Question

我想在我的 jsf 应用程序中包含 JScolor。可以通过<script> 标签实现，但我的意思是通过<h:outputScript> 更系统。

但是它不适用于资源。 JSColor 包含一个 js 文件和一些图片文件 - 似乎包含了 js 文件而没有包含资源。

谁能告诉我为什么？以及如何解决这个问题？

谢谢。

Answer 1

假设你的 js 文件的路径（名为 jquery.js 的文件）进入 resources/js 文件夹，如下所示：

resources/js/jquery.js

那么你必须写：

<h:outputScript name="./js/jquery.js"  target="body"/>

PS。注意属性目标（例如头部，身体）

Answer 2

在 web.xml 中添加

<servlet-mapping>
  <servlet-name>Resource Servlet</servlet-name>
  <url-pattern>/resources/*</url-pattern>
</servlet-mapping>

Answer 3

JS 文件显然是通过不代表有效 JSF 资源 URL 的相对路径引用图片文件。

<h:outputScript> 生成一个 JSF 资源 URL，该 URL 通过 JSF 资源处理程序，该处理程序担心自动本地化和版本控制等问题。它将生成一个以/javax.faces.resource 为前缀的URL，并附加当前使用的FacesServlet URL 映射，例如*.xhtml 或/faces/*。

因此，如果您在*.xhtml 上映射了faces servlet，并且有一个包含JS 和图像文件的/resources/jscolor 文件夹，并且引用了JS 文件，如下所示，

<h:outputScript name="jscolor/jscolor.js" />

然后它会生成

<script type="text/javascript" src="/context/javax.faces.resource/jscolor/jscolor.js.xhtml"></script>

但是，图像文件在/javax.faces.resource/jscolor 文件夹中并不实际可用，而是在/resources/jscolor 文件夹中实际可用。 /javax.faces.resource 只会在您将 faces servlet 映射应用于资源名称时自动解析。因此，这种特定情况只有在您手动编辑 jscolor.js 文件以更改图像文件名时才有效，例如arrow.gif 到 arrow.gif.xhtml。

如果您不使用 JSF 资源解析器的任何自动本地化或版本控制功能，也不使用任何需要真正 JSF 资源而不是静态 HTML 元素的特殊自定义资源解析器，例如 this one，那么您也可以只需继续使用普通的 HTML <script> 元素而不是 <h:outputScript>。

<script type="text/javascript" src="#{request.contextPath}/resources/jscolor/jscolor.js"></script>

Answer 4

我可能误解了你的问题，但这个 sn-p 会有所帮助：

<script
    type="text/javascript"
    src="#{facesContext.externalContext.requestContextPath}/path/on/WebContent/foo.js"></script>

我经常使用这种 java 资源 include，而不是 <h:outputScript>