使用请求转发加载不出目的页面CSS文件的解决方法

使用请求转发加载不出目的页面CSS文件的解决方法

当我们请求转发的目的页面是HTML文档或者JSP服务页面时，可能会出现一种情况，那就是页面的CSS文件或JS文件没有加载进去，那么这是上面问题呢？实际上这是路径的问题。

例如，假定我们的项目名称为：Store，当我们进入一个Servlet时（此Servlet的url-pattern为：do/servlet），重定向的目的JSP为：index.jsp。

该JSP页面中有以下引用：

<link rel="stylesheet" type="text/css" href="../../css/style.css" />
<link rel="stylesheet" type="text/css" href="../../css/shopping-mall-index.css" />
<script type="text/javascript" src="../../js/jquery.js"></script>
<script type="text/javascript" src="../../js/vin.js"></script>

在Servlet中的请求转发为：

request.getRequestDispatcher("../index.jsp").forward(request, response);

那么这样CSS和JS文件是加载不出来的，我们如果使用浏览器开发者工具查看，能发现这些文件报404错误，熟悉的人都知道这是什么错误，那么是什么文件没找到呢？有以下文件未找到：

http://localhost:8080/css/style.css
http://localhost:8080/css/shopping-mall-index.css
http://localhost:8080/js/jquery.js
http://localhost:8080/js/vin.js

问题分析：上面的URL中没有包含我们项目的名称，我们知道，请求转发地址栏不会改变（地址栏为http://localhost:8080/Store/do/servlet），而 href=”../../css/style.css” 此路径是相对于地址栏的路径，因而，实际上引用到的文件是 http://localhost:8080/css/style.css。

问题解决：把引用文件的路径改为两种的一种即可：

href="../css/style.css"

href="/Store/css/style.css"