2014-10-09 18 views
15

Voglio includere file js e css nel mio jsp, ma non sono in grado di farlo. Sono nuovo del concetto di MVC primaverile. Per molto tempo, ho lavorato su questo stesso argomento. Il mio indice di pagina è come questoCome includere js e CSS in JSP con 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> 

E la mia primavera-dispatcher-servlet.xml è così.

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

Il mio controller è come questo.

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

Qualcuno può aiutarmi in questo? Sto faticando molto ma non ho nessuna soluzione. Ho mantenuto il mio file js e css nella cartella WEB-INF.

risposta

17

Prima di tutto bisogna dichiarare le risorse nel file di dispatcher-servlet in questo modo:

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

qualsiasi richiesta con mappatura url/risorse/** cercherà direttamente per/risorse/cartella /.

Ora nel file JSP è necessario includere il file css in questo modo:

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

Allo stesso modo è possibile includere i file js.

Spero che questo risolva il tuo problema.

+0

Potresti spiegare il vantaggio di utilizzare questo approccio come ecc. Perché Spring ha scelto questo modo piuttosto che l'accesso tradizionale nella cartella webapps. Fornire un link anche benvenuto. –

2

Non è possibile accedere direttamente a nulla sotto ilfoldere. Quando i browser richiedono il tuo file CSS, non possono vedere all'interno della cartella WEB-INF.

Provare a mettere i file nella cartella css/css sotto WebContent.

e aggiungere il seguente in servlet dispatcher di concedere l'accesso,

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

simile per i file js. Un Nice example here su questo

+0

Non funziona. Ho provato anche http://www.mkyong.com/spring-mvc/spring-mvc-how-to-include-js-or-css-files-in-a-jsp-page/ ma ho ancora lo stesso risultato. – user2409128

+0

Qualcuno può aiutarmi a risolvere questo problema. – user2409128

+0

Puoi controllare il percorso intercettato nella console del browser –

18

mettere style.css cartella direttamente webapp/css non in WEB-INF

quindi aggiungere seguente codice nella vostra primavera-dispatcher-servlet.xml

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

e quindi utilizzare seguente codice nella tua pagina JSP

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

spero che funzionerà

0

è necessario dichiarare le risorse in dispatcher file.below servelet è di due dichiarazioni

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

In una situazione in cui si utilizza solo primavera e non Spring MVC, prendere il seguente approccio.

Inserire il seguente nel servlet dispatcher

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

Come noterete/css per la posizione foglio di stile, non ha bisogno di essere in/risorse cartella se non si ha la struttura di cartelle richiesta per MVC primavera come è il caso con un application.Same primavera vale per i file JavaScript, i font se li ecc bisogno

è possibile quindi accedere alle risorse come li avete bisogno in questo modo

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

Sono sicuro che qualcuno troverà questo utile come la maggior parte degli esempi sono con mvc primavera

2

Inserisci i file css/js nella cartella src/main/webapp/resources. Non metterli in WEB-INF o src/main/resources.

Quindi aggiungere questa linea alla primavera-dispatcher-servlet.xml

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

Includere file css/js nelle pagine JSP

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

Non dimenticare di dichiarare taglib in jsp

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
Problemi correlati