无法在 JSP 中包含 css 和 js 引用答案

【问题标题】：Unable to include css and js references in JSP无法在 JSP 中包含 css 和 js 引用
【发布时间】：2015-06-18 13:45:18
【问题描述】：

我正在尝试将 css 和 js 参考库添加到 jsp 页面中，但收到错误 404: file not found。

我尝试了各种网站和帖子中给出的许多不同方法，但无法解决问题。

这是项目结构：

我的web.xml 是：

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
    <display-name>SchoolERP</display-name>

    <servlet>
        <servlet-name>SchoolERP</servlet-name>
        <servlet-class>com.rms.school.controllers.ControllerHome</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>SchoolERP</servlet-name>
        <url-pattern>/ERP</url-pattern>
    </servlet-mapping>

    <welcome-file-list>
        <welcome-file>ERP</welcome-file>
    </welcome-file-list>

</web-app>

主 servlet ControllerHome.java 包含以下代码：

@WebServlet({ "/", "/home" })
public class ControllerHome extends HttpServlet {
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        RequestDispatcher rd = request.getRequestDispatcher("jsp/template.jsp");
        request.setAttribute("content_page", "welcome.jsp");
        rd.forward(request, response);

    }
}

和header.jsp文件包含以下代码：

<%@page import="com.rms.school.utils.Config"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<%
String title = request.getParameter("title");
if(title==null){
    title = "Untitled";
}%>
<title>
<%=title %>
</title>
<link href="${pageContext.request.contextPath}/css/bootstrap.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/bootstrap-theme.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/ndt-custom.css" rel="stylesheet" type="text/css"/>
<link href="${pageContext.request.contextPath}/css/menu-styles.css" rel="stylesheet" type="text/css"/>

<!-- HTML5 shim for IE backword compatibility-->
    <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
        </script>
    <![endif]-->
</head>

<body>

welcome.jsp 是包含以下代码的简单文件：

<h1>WELCOME !</h1>

并且jsp/include 文件夹中的footer.jsp 包含body 和html 的所有结束标记。

我也尝试使用标签库包含文件。但是问题还是没有解决。

当我在 http://localhost:8080/SchoolERP/ 看到输出页面时，它在 firebug 中给出错误：

"NetworkError: 404 Not Found - http://localhost:8080/SchoolERP/css/bootstrap.css"

而page source 显示head 部分如下：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<title>
Untitled
</title>
<link href="/SchoolERP/css/bootstrap.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/bootstrap-theme.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/ndt-custom.css" rel="stylesheet" type="text/css"/>
<link href="/SchoolERP/css/menu-styles.css" rel="stylesheet" type="text/css"/>

<!-- HTML5 shim for IE backword compatibility-->
    <!--[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
        </script>
    <![endif]-->
</head>

当我点击此源中的文件链接时，我收到以下错误：

请帮助我知道我在哪里以及我做错了什么。

提前致谢。

【问题讨论】：

你的 template.jsp 页面在 css 文件夹内吗？从您的文件夹结构来看，我猜它在外面。检查文件路径中的所有内容是否正确？ CSS、js、img、jsp 页面位于适当的文件夹中，但您在 css 下链接 - > jsp 页面在那里.. 如果您更改它，页面可能会工作:)
css 和 jsp 是 WebContent 中的文件夹。所有.css 文件都在css 文件夹中。 template.jsp 和 welcome.jsp 位于 jsp 文件夹中。而header.jsp 和footer.jsp 位于css/include/ 文件夹中。但我使用pageContext.request.contextPath 提供了所有源文件路径（.css 和.js）w.r.t root。这些 jsp 文件中的所有文本都被加载。但是 css 和 js 文件没有被应用（包括在内）。

标签： html css jsp tomcat7 eclipse-juno

【解决方案1】：

经过长时间的搜索和尝试，我们终于找到了问题的根源......

servlet 类@WebServlet({ "/", "/home" }) 上面的注释实际上是导致问题的原因。我刚刚删除它，问题得到解决。

事实上，这个注解不是必须的，因为它已经作为web.xml的一部分添加了。

【讨论】：