我不能在jsp页面中包含css文件

Question

我尝试了各种教程，但它只是简单地工作了。

我正在使用boostrap构建spring应用程序。我想在我的jsp页面中包含bootstrap.min.css。

这是我的项目树：

这是我的spring配置文件：

    <?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:context="http://www.springframework.org/schema/context"
    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-4.0.xsd
        http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-4.0.xsd">

    <mvc:annotation-driven />
    <context:component-scan base-package="com.packt.webstore" />
    <mvc:resources mapping="/resources/**" location="/WEB-INF/resources/" />
    <mvc:resources  location="WEB-INF"  mapping="/resource"/>
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/views/" />
        <property name="suffix" value=".jsp" />
    </bean>
    <bean id="multipartResolver"  class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="maxUploadSize" value="10240000"/>
    </bean>
</beans>

这一行非常重要：

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

这是我的观点页面：

我上传的图片是为了表明我甚至无法导入图片，因为它不会识别路径。好吧，我尝试了其他配置，但我无法弄清楚如何以正确的方式做到这一点。

Answer 1

你可以使用jstl：

<link href="<c:url value="/resources/css/main.css" />" rel="stylesheet">
<script src="<c:url value="/resources/js/jquery.1.10.2.min.js" />"></script>

或Spring标签：

<spring:url value="/resources/js/jquery.1.10.2.min.js" var="jqueryJs" />
<spring:url value="/resources/js/main.js" var="bootstrap" />

<link href="${bootstrap}" rel="stylesheet" />
<script src="${jqueryJs}"></script>

或

<link href="${pageContext.request.contextPath}/resources/css/main.css" rel="stylesheet" > 
<script src="${pageContext.request.contextPath}/resources/css/jquery.js"></script>

Answer 2

前段时间我使用jsp和servlet创建了简单的Web应用程序，但我遇到了同样的问题。我通过在每个网址的开头添加上下文名称来解决此问题。以下是该网址的示例：

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/form-style.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/edit-contact-form-style.css" />

<script src="${pageContext.request.contextPath}/js/edit-contact-form-scripts.js"></script>
<script src="${pageContext.request.contextPath}/js/datetimepicker.js"></script>

试试吧。我希望这会有所帮助。

Answer 3

配置视图解析程序并在配置的位置下移动css文件。 你可以参考这个已经回答的问题：spring mvc where to put css/js/img files

Answer 4

如果您不想像那些xml失败者，并且使用零xml做一个应用程序，请不要忘记创建这样的类：

public class DemoAppConfig implements WebMvcConfigurer {
    @Bean
    public ViewResolver viewResolver() {
        final InternalResourceViewResolver bean = new InternalResourceViewResolver();

        bean.setViewClass(JstlView.class);
        bean.setPrefix("/WEB-INF/view/pages/");
        bean.setSuffix(".jsp");



        return bean;
    }


    public void addResourceHandlers(final ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/resources/**").addResourceLocations("/resources/");
    }
}