我第一次创建了spring maven项目css，js，图片没有加载我试过这里给出的所有解决方案仍然没有工作

Question

I have create spring maven project for the first time, and my css,js, images are not loading i have tried all the solutions given here still its not working. 我第一次创建了spring maven项目，并且我的css，js，图像没有加载我已经尝试了这里给出的所有解决方案仍然无法正常工作。

My directory structure is shown in image: 我的目录结构如图所示：

dispatcher-servlet.xml 调度员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"
    xsi:schemaLocation="
http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.0.xsd
http://www.springframework.org/schema/mvc 
http://www.springframework.org/schema/mvc/spring-mvc.xsd">

    <context:component-scan base-package="com.niit.musicstore" />

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

index.jsp 的index.jsp

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page contentType="text/html; charset=UTF-8" language="java"%>
<html>
<title>Home</title>
<%-- <meta name="description" content="">
<meta name="viewport"
    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

<link rel="stylesheet"
    href="<c:url value="./resources/css/bootstrap.min.css" />" />
<script src="<c:url value="./resources/js/jquery-1.12.4.min.js" />"></script>
<script src="<c:url value="./resources/js/bootstrap.min.js" />"></script>
<link rel="stylesheet"
    href="<c:url value="./resources/css/styles.css" />" /> --%>
    <%@ include file="header.jsp"%>
<body>



    <div class="carousel slide" id="myCarousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li class="active" data-slide-to="0" data-target="#myCarousel"></li>
            <li data-slide-to="1" data-target="#myCarousel"></li>
            <li data-slide-to="2" data-target="#myCarousel"></li>
        </ol>
        <!-- Wrapper for slides -->
        <div class="carousel-inner">
            <div class="item active" id="slide1">
                <div class="carousel-caption">
                    <h4>Music is here</h4>
                    <p>Feel the music and buy your choice you have all the options
                        here!!</p>
                </div>
                <!-- end carousel-caption -->
            </div>
            <!-- end item -->

            <div class="item" id="slide2">
                <div class="carousel-caption">
                    <h4>Songs are here</h4>
                    <p>Listen the song and buy your choice you have all the options
                        here!!</p>
                </div>
                <!-- end carousel-caption -->
            </div>
            <!-- end item -->

            <div class="item" id="slide3">
                <div class="carousel-caption">
                    <h4>Life is happy with songs</h4>
                    <p>Feel the music,Listen the song and buy your choice you have
                        all the options here!!!</p>
                </div>
                <!-- end carousel-caption -->
            </div>
            <!-- end item -->
        </div>
        <!-- end carousel-inner -->

        <!-- Controls -->
        <a class="left carousel-control" data-slide="prev" href="#myCarousel"><span
            class="icon-prev"></span></a> <a class="right carousel-control"
            data-slide="next" href="#myCarousel"><span class="icon-next"></span></a>
    </div>
    <!-- end myCarousel -->


    <div class="row" id="features">

        <div class="col-sm-4 feature">
            <img src="<c:url value="./../resources/images/tabla.png" />" alt="
                MusicHub" class="img-circle">
            <h3>Tabla</h3>
        </div>
        <!-- end col-sm-4 -->

        <div class="col-sm-4 feature" id="middle-slide">
            <img src="<c:url value="./../resources/images/sitar.png" />" alt="
                MusicHub" class="img-circle">
            <h3>Sitar</h3>
        </div>
        <!-- end col-sm-4 -->

        <div class="col-sm-4 feature" id="last-slide">
            <img src="<c:url value="./../resources/images/flute1.png" />" alt="MusicHub"
                class="img-circle">
            <h3>Flute</h3>
        </div>
        <!-- end col-sm-4 -->
    </div>
    <!-- end row -->

    <script>
        $('.carousel').carousel({
            interval : 6000
        })
    </script>

    <%-- <%@ include file="footer.jsp"%> --%>

</body>
</html>

pom.xml 的pom.xml

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.niit.musicstore</groupId>
  <artifactId>musicstore</artifactId>
  <packaging>war</packaging>
  <version>0.0.1-SNAPSHOT</version>
  <name>musicstore Maven Webapp</name>
  <url>http://maven.apache.org</url>
  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>3.8.1</version>
      <scope>test</scope>
    </dependency>

    <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-core</artifactId>
            <version>4.0.1.RELEASE</version>
        </dependency>

        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-web</artifactId>
            <version>4.0.1.RELEASE</version>
        </dependency>

        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
            <version>4.0.1.RELEASE</version>
        </dependency>

 <dependency>
            <groupId>jstl</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>jstl</artifactId>
            <version>1.2</version>
        </dependency>

        <dependency>
            <groupId>taglibs</groupId>
            <artifactId>standard</artifactId>
            <version>1.1.2</version>
        </dependency>


  </dependencies>
  <build>
    <finalName>musicstore</finalName>
  </build>
</project>

This is the output: 这是输出：

这是输出

Answer 1

1) Add this code to your spring-mvc-config.xml 1）将此代码添加到spring-mvc-config.xml

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

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

<mvc:annotation-driven />

2) You don't map your resources correctly with <c:url> tag 2）您没有使用<c:url>标记正确映射资源

<link rel="stylesheet"
    href="<c:url value="/resources/css/bootstrap.min.css" />" >
<script src="<c:url value="/resources/js/jquery-1.12.4.min.js" />"></script>
<script src="<c:url value="/resources/js/bootstrap.min.js" />"></script>
<link rel="stylesheet"
    href="<c:url value="/resources/css/styles.css" />" >

我第一次创建了spring maven项目css，js，图片没有加载我试过这里给出的所有解决方案仍然没有工作

问题描述

1 个解决方案

解决方案1
0 已采纳 2016-06-17 12:00:57

我第一次创建了spring maven项目css，js，图片没有加载我试过这里给出的所有解决方案仍然没有工作

问题描述

1 个解决方案

解决方案1 0 已采纳 2016-06-17 12:00:57

解决方案1
0 已采纳 2016-06-17 12:00:57