web-dev-qa-db-fra.com

Comment inclure js et CSS dans JSP avec Spring MVC

Je veux inclure des fichiers js et css dans mon jsp, mais je ne suis pas en mesure de le faire. Je suis nouveau sur le concept de printemps MVC. Je travaille depuis longtemps sur le même sujet. Ma page d'index est comme ça

<!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>

Et mon spring-dispatcher-servlet.xml est comme ça.

<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>

Mon contrôleur est comme ça.

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;
        }
    }

Quelqu'un peut-il m'aider dans ce domaine? Je me bats très fort mais je n'obtiens aucune solution. J'ai gardé mes fichiers js et css dans le dossier WEB-INF.

20
user2409128

Vous devez d’abord déclarer vos ressources dans un fichier dispatcher-servlet comme suit:

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

Toute demande d'URL mapping/resources/** recherchera directement/resources/folder /.

Maintenant, dans le fichier jsp, vous devez inclure votre fichier css comme ceci:

<link href="<c:url value="/resources/css/main.css" />" rel="stylesheet">

De même, vous pouvez inclure des fichiers js.

J'espère que ceci résoudra votre problème.

21
Atul Sharma

Placez votre style.css Directement dans le dossier webapp/css Et non dans le dossier WEB-INF.

Ajoutez ensuite le code suivant dans votre spring-dispatcher-servlet.xml

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

puis ajoutez le code suivant dans votre page jsp

<link rel="stylesheet" type="text/css" href="css/style.css"/>

J'espère que ça va marcher.

19
Saurabh Gaur

Dans une situation où vous utilisez uniquement le printemps et non le printemps, adoptez l'approche suivante.

Placez les éléments suivants dans le répartiteur de servlets

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

Comme vous remarquerez/css pour l'emplacement de la feuille de style, il ne doit pas nécessairement figurer dans le dossier/resources si vous ne disposez pas de la structure de dossier requise pour spring mvc, contrairement à une application spring. vous avez besoin d'eux etc.

Vous pouvez ensuite accéder aux ressources selon vos besoins,

<link rel="stylesheet" href="css/vendor/swiper.min.css" type="text/css" />
<link rel="stylesheet" href="css/styles.css" type="text/css" />

Je suis sûr que quelqu'un trouvera cela utile car la plupart des exemples sont avec Spring MVC

4
Francis Benyah

Placez vos fichiers css/js dans le dossier src/main/webapp/resources. Ne les mettez pas dans WEB-INF ou src/main/resources.

Ajoutez ensuite cette ligne à spring-dispatcher-servlet.xml

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

Inclure les fichiers css/js dans les pages jsp

<link href="<c:url value="/resources/style.css" />" rel="stylesheet">

N'oubliez pas de déclarer taglib dans votre jsp

<%@ taglib uri="http://Java.Sun.com/jsp/jstl/core" prefix="c" %>
2
pipi

Vous ne pouvez accéder directement à rien sous le WEB-INF Foldere. Lorsque les navigateurs demandent votre fichier CSS, ils ne peuvent pas voir le dossier WEB-INF.

Essayez de placer votre dossier de fichiers css/css Sous WebContent.

Et ajoutez ce qui suit dans dispatcher servlet pour accorder l'accès,

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

de même pour vos fichiers js. A Bel exemple ici à ce sujet

2
San Krish

vous avez besoin de déclarer des ressources dans dispatcher servlet file.below est deux déclarations

<mvc:annotation-driven />
<mvc:resources location="/resources/" mapping="/resources/**" />
0
rajeesh