为什么不能从 JSP 文件中加载图像和样式表？答案

【问题标题】：Why could images and stylesheets not be loaded from JSP file?为什么不能从 JSP 文件中加载图像和样式表？
【发布时间】：2015-05-13 11:27:35
【问题描述】：

过去，我们使用 SSO 解决方案进行身份验证。 servlet 过滤器正在检查登录等。为了降低成本，我们希望用针对我们数据库的简单身份验证来替换它。

这里的计划是使用旧的登录/密码更改 jsp（位于 sso 服务器上）并以这种方式直接在我们的应用程序中调用它（如果过滤器检测到未登录的用户）：

req.getRequestDispatcher("/auth/login.jsp").include(req, response);

页面被显示，但只有文本。不显示图像和样式表。（找不到）。

<img src="/auth/platform.jpg" alt="platform" class="left" />

我尝试了其他几种方法，但所有这些版本都不起作用。我知道，相对路径行不通！

<img src="auth/platform.jpg" />
<img src=".auth/platform.jpg" />
<img src="<%=request.getContextPath()%>/auth/platform.jpg" />

我输出了以下内容，一切都是空的。

ServletPath: <%request.getServletPath(); %> <br />
ServletContext: <%request.getServletContext();%> <br />
ContextPath: <%request.getContextPath(); %> <br />
LocalAddr: <%request.getLocalAddr(); %> <br />
PathInfo: <%request.getPathInfo(); %> <br />
RemoteAddr: <%request.getRemoteAddr(); %> <br />
RemoteHost: <%request.getRemoteHost(); %> <br />

在原始项目（登录页面所在的项目）中，jsp 仅如下所示：

<img src="images/platform.jpg" />

它可以工作，也可以使用相对引用...

通过以这种方式（或上述任何其他方式）引用它也无法找到样式表：

<link href="/auth/style.css" rel="stylesheet" type="text/css" />

但如果我使用这种方式，它就可以工作！

<style>
    <%@ include file="/auth/style.css"%>
</style>

这是我的结构：

我的 web.xml 中是否还需要其他任何内容？

我知道，现在会使用 JSF，但这是一个老项目，应该尽可能少修改。

这是http错误信息：

ERROR] 500 - GET /auth/platform.jpg (127.0.0.1) 2720 bytes
   Request headers
      Host: localhost:8888
      User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:26.0) Gecko/20100101 Firefox/26.0
      Accept: image/png,image/*;q=0.8,*/*;q=0.5
      Accept-Language: en-gb,en;q=0.5
      Accept-Encoding: gzip, deflate
      Referer: http://localhost:8888/Application.html?gwt.codesvr=127.0.0.1:9997&groupId=xxx
      Cookie: JSESSIONID=b56c92nn81g51d28ys2l65dg2
      Connection: keep-alive
   Response headers
      Accept-Ranges: bytes
      Content-Type: text/html
      Content-Length: 2720
      Last-Modified: Thu, 30 Apr 2015 11:43:38 GMT

【问题讨论】：

如果您发布应用程序的图片（文件夹结构），将很容易回答。
此外，您为这些文件获取的 HTTP 状态代码也会有所帮助。
你的应用的上下文路径是什么？
在粘贴错误消息时，我看到了以下内容：Accept: image/png,image
你想在login.jsp处显示platform.jpg吗？

标签： java jsp

【解决方案1】：

JSP 中图像和 CSS 的路径应该相对于您的 servlet 的 URL，而不是 JSP 文件本身。

【讨论】：

我有点困惑。相对于我的 servlet 的正确 URL 是什么？
@NiceGuy 你能提供你的servlet URL吗？
这个？ localhost:8888/Application.html?gwt.codesvr=127.0.0.1:9997&...
在web.xml 中定义的用于加载其类具有此代码的servlet：req.getRequestDispatcher("/auth/login.jsp").include(req, response);
我认为这里有点复杂，这就是我的困惑造成的。在 web.xml 中，只为 RequestFactory 配置了一个 Servlet。（com.google.web.bindery.requestfactory.server.RequestFactoryServlet）。其余部分通过 guice 配置。

【解决方案2】：

您可以将 HTML 标记设置为应用程序的上下文根（例如 http://locahost:8080/myapp），文档中的所有相对 URL 都将相对于此进行解析：

http://www.w3schools.com/tags/tag_base.asp

所以在您的 JSP 中，您可以执行以下操作

<%
    String path = request.getContextPath();
    String basePath = request.getScheme()
        + "://"
        + request.getServerName()
        + ":"
        + (request.getServerPort() != 80
            ? request.getServerPort()
            : "") + path + "/";
%>

    <head>
        <base href="<%=basePath%>" />

        <!-- relative link to a folder 'css' in the webapp root -->
        <link href="css/my-css.css" rel="stylesheet" media="screen" />

    </head>
</html>

您可能可以通过使用或调整此处的方法来避免使用 scriptlet

how to get the base url from jsp request object?

如果您没有使用模板库，那么您可以创建一个标签文件以避免在所有页面中重复此操作。

【讨论】：

【解决方案3】：

搜索了几个小时后，我找到了“不显示图像和加载样式表”的原因。

使用以下 HTML 代码，我得到了 HTTP 200（直截了当...）

<img src="images/xxx.jpg" />

图像未显示的原因是身份验证（servlet）过滤器，它正在检查现有会话（用户登录等）。由于这是一个登录页面，因此没有有效的会话并且所有其他请求（加载样式表和图像）都会被阻止。

我的过滤器看起来像：

Guice.createInjector(..., new ServletModule() {

   @Override
   protected void configureServlets() {
      filter("/*").through(MyFilter.class);
   }
}

允许图像 (jpgs) 的最简单方法是将以下内容添加到我的 doFilter() 中：

if (httpServletRequest.getRequestURI().endsWith(".jpg")) {
    chain.doFilter(request, response);
}

问题是要找出来，就是导致问题的过滤器...

谢谢各位。

【讨论】：