javascript - Spring MVC : CSS & JS not getting applied to Jsp page

标签 javascript css jsp spring-mvc

我正在尝试创建一个 Spring MVC 应用程序。我的第一页正在显示,但 css 和 js 没有应用到它。

以下是我的文件:

Web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
id="WebApp_ID" version="3.1">

<display-name>SpringMVC</display-name>

<servlet>
    <servlet-name>dispatcher</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
</servlet>

<servlet-mapping>
    <servlet-name>dispatcher</servlet-name>
    <url-pattern>/</url-pattern>
</servlet-mapping>
</web-app>

dispatcher-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
  http://www.springframework.org/schema/beans/spring-beans.xsd
  http://www.springframework.org/schema/context
  http://www.springframework.org/schema/context/spring-context.xsd
  http://www.springframework.org/schema/mvc
  http://www.springframework.org/schema/mvc/spring-mvc.xsd
  http://www.springframework.org/schema/aop
  http://www.springframework.org/schema/aop/spring-aop.xsd
  http://www.springframework.org/schema/tx 
  http://www.springframework.org/schema/tx/spring-tx-4.3.xsd">

<context:component-scan base-package="com.spring.web.controller" />
<mvc:resources mapping="css/**" location="/css/" />
<mvc:resources mapping="js/**" location="/views/js/" />
<mvc:resources mapping="images/**" location="/views/images/" />

<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
    <property name="prefix" value="/WEB-INF/views/" />
    <property name="suffix" value=".jsp" />
</bean>
</beans>

我的 LoginController.java

@Controller
@RequestMapping(value="/")
public class LoginController {

private final Logger logger = Logger.getLogger(LoginController.class);

@RequestMapping(method=RequestMethod.GET)   
public ModelAndView getModelAndView()
{
    ModelAndView model=new ModelAndView("Login", "WelcomeMessage", "WELCOME TO SPRING MVC");
    return model;
}
}

我的 Css & Js 以及其他文件如下所示

CSS & JS Location

我的 Login.jsp

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<link rel="stylesheet" href="css/login.css" />
<script type="text/javascript" src="js/login_sign_script.js"></script>
<title>Welcome</title>

请帮忙。提前致谢

最佳答案

因为你把你的资源文件放在了views文件夹中,而views是WEB-INF文件夹的子文件夹。

WEB-INF 资源可供您的 Web 应用程序的资源加载器访问,并且对公众不直接可见。

您可以从 What is WEB-INF used for in a Java EE web application? 中找到关于if 的详细信息。

所以有两种方法可以做到:

1.如果你还想把它放到你的WEB-INF/views文件夹下,那么你需要改变mvc资源映射如下:

<mvc:resources mapping="/css/**" location="/WEB-INF/views/css/" />
<mvc:resources mapping="/js/**" location="/WEB-INF/views/js/" />

2.从WEB-INF/views中删除css和js文件夹,并使它们直接位于webapps文件夹中,如下所示:
enter image description here

然后我们可以如下更新资源映射:

<mvc:resources mapping="/css/**" location="/css/" />
<mvc:resources mapping="/js/**" location="/js/" />

或者我们可以删除 mvc 资源映射并在 web.xml 中添加默认的 servlet 映射,如下所示,它也可以正常工作:

<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.css</url-pattern>
</servlet-mapping>
<servlet-mapping>
    <servlet-name>default</servlet-name>
    <url-pattern>*.js</url-pattern>
</servlet-mapping>

编辑于 2018-04-11

下面是我的测试元素截图 enter image description here

源代码在 Google Drive

关于javascript - Spring MVC : CSS & JS not getting applied to Jsp page,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49677741/

相关文章:

javascript - 如何在jquery中验证对象

css - 当我调整窗口大小时,如何防止我的子 div 在彼此下面移动?

java - struts2中实现session的最标准方式

java - session 和请求的对象

javascript:switch 语句中的常用命令

Javascript 正则表达式匹配

javascript - 在路由器中动态安装引擎

javascript - 使用 jquery addClass、添加文本和删除 li 的对象格式

javascript - 下拉菜单中改变线宽

java - JSP 不能在 CQ5 中编译?