在JSP文件中包含JavaScript库

Question

我正在尝试使用JSP文件中的JavaScript库中的JavaScript函数在Web浏览器页面上显示结果，但似乎包含不起作用。

我实际上将与库对应的.js文件放在WEB-INF文件夹中，并在JSP文件中添加以下行以将其包含在其中：

    <script type="text/javascript" src="./jsgl.min.js"></script>

我成功地设法在一个简单的HTML文件中使用该库，这就是为什么我不明白为什么这不起作用的原因。

编辑：

Answer 1

<强> TLDR

将JS文件放在Web内容下的文件夹中（但不是 WEB-INF），如[WebContent] /js/jsgl.min.js，并在JSP中使用以下内容：

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jsgl.min.js"></script>

<强>解释

JSP文件由服务器编译，然后处理以将数据（通常是HTML）发送回Web浏览器。 <script>标记是由浏览器解释而不是由servlet容器解释的HTML标记。因此，浏览器会在HTML中看到在服务器中为src属性中的JavaScript文件发出新请求。

src属性是相对于浏览器要求的URL而不是服务器上JSP的路径。

举个例子，让我们说：

• 浏览器要求http://example.com/SomeWebApp/some-resource
页面
• servlet容器在内部将请求转发给/WEB-INF/jsp/somepage.jsp
的JSP
• 发送到浏览器的响应包含脚本标记<script type="text/javascript" src="./jsgl.min.js"></script>（如您的问题所示）
• 浏览器会看到网址./jsgl.min.js并将其解析为相对于它已向服务器询问的网址（在这种情况下为http://example.com/SomeWebApp/some-resource - 请注意，没有尾随'/'）因此浏览器将从http://example.com/SomeWebApp/jsgl.min.js *请求JS文件。这是因为脚本标记的src属性中的相对URL以“。”开头。

另一个答案建议将JS文件放在'js'文件夹中，并将脚本标记更改为<script type="text/javascript" src="/js/jsgl.min.js"></script>。使用与上例相同的原始网页网址，浏览器会将此src网址翻译为http://example.com/js/jsgl.min.js。请注意，这缺少“/ SomeWebApp”上下文路径。

因此，最好的解决方案是将JS文件放在像/js/jsgl.min.js这样的静态文件夹中，但要在JSP脚本标记中使用以下内容：

<script type="text/javascript" src="${pageContext.request.contextPath}/js/jsgl.min.js"></script>

JSP会将${pageContext.request.contextPath}位转换为当前上下文路径，使代码可移植（如果使用不同的上下文路径重新部署webapp，它仍然可以工作）。因此，浏览器收到的HTML响应（再次，坚持上面的示例）：

<script type="text/javascript" src="/SomeWebApp/js/jsgl.min.js"></script>

浏览器现在将解析到正确目标的相对URL。

__

*如果原始网址有一个尾部斜杠=即http://example.com/SomeWebApp/some-resource/，则JS网址为http://example.com/SomeWebApp/some-resource/jsgl.min.js

Answer 2

静态资源应放在WEB-INF文件夹之外（因为您通常不允许Web访问其内容）。

您可以将文件放在webapp / js /下，然后将脚本导入更改为：

<script type="text/javascript" src="/js/jsgl.min.js"></script>

除了良好实践外，这还不错，因为它与JSP文件的位置无关。

Answer 3

Files in WEB-INF are inaccessible.

您可以将它们置于webapp下并尝试按上述方式进行访问。