如何使用 Spring MVC 在 JSP 中包含 js 和 CSS
Posted
技术标签:
【中文标题】如何使用 Spring MVC 在 JSP 中包含 js 和 CSS【英文标题】:How to include js and CSS in JSP with spring MVC 【发布时间】:2014-12-04 06:38:03 【问题描述】:我想在我的 jsp 中包含 js 和 css 文件,但我不能这样做。我是 Spring MVC 概念的新手。很长一段时间以来,我一直在研究同一主题。 我的索引页面是这样的
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="$pageContext.request.contextPath/style.css"/>
<script type="text/javascript" src="$pageContext.request.contextPath/LoginPageScrip.js">
</script>
<style type="text/css">
body
background-image: url("LoginPageBackgroundImage.jpg");
</style>
</head>
<body >
<h6>Please login in google Chrome</h6>
<h1 align="center">Welcome to my Twitter Clone</h1>
<div class="m" style="margin-left: 401px; margin-top: 70px;">
<form method="post" action="LoginForExistingUser" onsubmit="return Validate(this);">
<fieldset>
<legend align="center">Login</legend>
<div class="a">
<div class="l">User Name</div>
<div class="r">
<INPUT type="text" name="userName">
</div>
</div>
<div class="a">
<div class="l">Password</div>
<div class="r">
<INPUT type="password" name="password">
</div>
</div>
<div class="a">
<div class="r">
<INPUT class="button" type="submit" name="submit"
value="Login">
</div>
</div>
<i align="center" style="margin-left: 183px;">New User? <a href="signup.html"><u>Signup</u></a></i>
</fieldset>
</form>
</div>
</body>
</html>
而我的spring-dispatcher-servlet.xml是这样的。
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:mvc="http://www.springframework.org/schema/mvc"
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">
<context:component-scan base-package="com.csc.student" />
<mvc:annotation-driven/>
<!--<bean id="HandlerMapping" class="org.springframework.web.servlet.handler.BeanNameUrlHandlerMapping" />-->
<!-- <bean name="/welcome.html" class ="csc.csc.helloController.HelloController" /> -->
<bean id="viewResolver" class = "org.springframework.web.servlet.view.InternalResourceViewResolver" >
<property name="prefix">
<value>/WEB-INF/</value>
</property>
<property name ="suffix">
<value>.jsp</value>
</property>
</bean>
</beans>
我的控制器是这样的。
package com.csc.student;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.servlet.ModelAndView;
@Controller
public class StudentInfoController
@RequestMapping(value = "/indexPage.html", method = RequestMethod.GET)
public ModelAndView getAdmissionFrom()
ModelAndView model = new ModelAndView("indexPage");
return model;
有人可以帮助我吗?我非常努力,但我没有得到任何解决方案。我将 js 和 css 文件保存在 WEB-INF 文件夹中。
【问题讨论】:
【参考方案1】:首先你需要像这样在 dispatcher-servlet 文件中声明你的资源:
<mvc:resources mapping="/resources/**" location="/resources/folder/" />
任何带有 url 映射 /resources/** 的请求都会直接查找 /resources/folder/。
现在在 jsp 文件中,您需要像这样包含您的 css 文件:
<link href="<c:url value="/resources/css/main.css" />" rel="stylesheet">
同样你可以包含 js 文件。
希望这能解决您的问题。
【讨论】:
能否请您解释一下使用这种方法的好处,如将您的style.css
直接放入webapp/css
文件夹,而不是放入WEB-INF
文件夹。
然后将以下代码添加到您的spring-dispatcher-servlet.xml
<mvc:resources mapping="/css/**" location="/css/" />
然后将以下代码添加到您的jsp页面中
<link rel="stylesheet" type="text/css" href="css/style.css"/>
我希望它会起作用。
【讨论】:
【参考方案3】:在您只使用spring而不使用spring mvc的情况下,请采取以下方法。
将以下内容放在 servlet 调度程序中
<mvc:annotation-driven />
<mvc:resources mapping="/css/**" location="/WEB-INF/assets/css/"/>
<mvc:resources mapping="/js/**" location="/WEB-INF/assets/js/"/>
您会注意到 /css 用于样式表位置,如果您没有 spring mvc 所需的文件夹结构,则不必位于 /resources 文件夹中,就像 spring 应用程序一样。同样适用于 javascript 文件, 字体,如果你需要的话等等。
然后您可以根据需要访问资源
<link rel="stylesheet" href="css/vendor/swiper.min.css" type="text/css" />
<link rel="stylesheet" href="css/styles.css" type="text/css" />
我相信有人会发现这很有用,因为大多数示例都使用 spring mvc
【讨论】:
【参考方案4】:您无法直接访问WEB-INF
文件夹下的任何内容。当浏览器请求您的 CSS 文件时,他们看不到 WEB-INF 文件夹的内部。
尝试将您的文件css/css
文件夹放在WebContent
下。
并在调度程序 servlet 中添加以下内容以授予访问权限,
<mvc:resources mapping="/css/**" location="/css/" />
同样适用于您的 js 文件。一个Nice example here这个
【讨论】:
它不工作。我也试过mkyong.com/spring-mvc/…,但输出还是一样。 可以在浏览器控制台查看截获的路径【参考方案5】:将您的 css/js 文件放在文件夹 src/main/webapp/resources
中。不要将它们放在WEB-INF
或src/main/resources
中。
然后将这一行添加到 spring-dispatcher-servlet.xml 中
<mvc:resources mapping="/resources/**" location="/resources/" />
在 jsp 页面中包含 css/js 文件
<link href="<c:url value="/resources/style.css" />" rel="stylesheet">
别忘了在你的jsp中声明taglib
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
【讨论】:
【参考方案6】:你需要在 dispatcher servelet 文件中声明资源。下面是两个声明
<mvc:annotation-driven />
<mvc:resources location="/resources/" mapping="/resources/**" />
【讨论】:
【参考方案7】:您应该将包含 css 和 js 文件的文件夹放入“webapp/resources”。 如果你把它们放在“src/main/java”中,你必须改变它。它对我有用。
【讨论】:
【参考方案8】:如果你使用基于 java 的注解,你可以这样做:
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry)
registry.addResourceHandler("/static/**").addResourceLocations("/static/");
静态文件夹在哪里
src
│
└───main
└───java
└───resources
└───webapp
└───static
└───css
└───....
【讨论】:
以上是关于如何使用 Spring MVC 在 JSP 中包含 js 和 CSS的主要内容,如果未能解决你的问题,请参考以下文章