spring mvc - how to remove the word 'resources' when calling js,css,images - spring

I have a resources folder in my WebContent folder that contains css, js, and images... Then i declare mvc resource mapping to locate all the resources file... but when i tried to call/acccess the file in my jsp, why is that i need to include the word resources?... do you know how can i remove it but still able to access my resources?
project structure
WebContent
|_resources
|_images
|_js
|_WEB-INF
|_jsp
|_header.jsp
header.jsp
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script src="<c:url value="/resources/js/jquery.min.js" />"></script>
dispatcher.xml
<mvc:resources mapping="/resources/**" location="/resources/" />
<mvc:annotation-driven />
above code works perfectly, but i want to exclude the word resources in path..
without writing one by one all the inside resources folder (like sample below)
<mvc:resources mapping="/images/**" location="/resources/images/" />
<mvc:resources mapping="/css/**" location="/resources/css/" />
what i need is something like this... but still declaring one line mvc resource mapping
<script src="<c:url value="/js/jquery.min.js" />"></script>
<link rel="stylesheet" href="<c:url value="/css/owl.carousel.min.css" />">
<img src="<c:url value="/images/pix/world.jpg" />" alt="user">

Do you use the server is tomcat? If you use the server is tomcat, you can do the following configuration
<Url-pattern> / </ url-pattern> means to intercept all requests.
If you need to deal with static resources js, css, etc., you can add in web.xml written before dispatcherServlet
<servlet-mapping>
<servlet-name>default</servlet-name>
<url-pattern>*.css</url-pattern>
<url-pattern>*.js</url-pattern>
</servlet-mapping>
Default is Tomcat's default servlet!

Related

SpringMVC - cann't able to acces JS and CSS file in index.jsp

I have added
<mvc:resources mapping="/webapp/**" location="/webapp/" />
<mvc:default-servlet-handler />
in my dispatch-servlet.xml
my folder hierarchy is
enter image description here
and in index.jsp i declared
<spring:url value="/webapp/resources/js/bootstrap.min.js" var="bootstrapJS" />
<script src ="${bootstrapJS}" type="text/javascript"></script>
can any one tell the actuall issue is with code or folder hierarchy
Hi have you included the tag at the top of index.jsp it will look something like this. <%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>

spring mvc static resources failed to load

I am trying to use static resources in my sample spring mvc project, In my project I have created a theme under resources folder as shown in the picture.
Then I have added the following 3 lines of code in spring-mvc-servlet.xml
<?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:p="http://www.springframework.org/schema/p"
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-4.1.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-4.1.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-4.1.xsd">
<context:component-scan base-package="com.sudheer.example" />
<context:annotation-config />
<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/jsp/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>
<mvc:resources mapping="/resources/**" location="/resources/theme/" cache-period="31556926"/>
<mvc:default-servlet-handler/>
<mvc:annotation-driven />
</beans>
WhenI try to access the static resources in many differnt ways,I am not able to access it.
This is my jsp page:
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html>
<html lang="en">
<head>
<link href="/resources/themes/css/bootstrap.min.css" rel="stylesheet" >
<link rel="stylesheet" type="text/css"
href="${pageContext.request.contextPath}/themes/bootstrap.min.css">
<link href="<c:url value="/resources/themes/css/bootstrap.min.css"/>"
rel="stylesheet" type="text/css"/>
</head>
<body>
<h1>1. Test CSS</h1>
<h2>2. Test JS</h2>
<div class="btn"></div>
</body>
</html>
And this is my web.xml
<!DOCTYPE web-app PUBLIC
"-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd" >
<web-app>
<display-name>Archetype Created Web Application</display-name>
<servlet>
<servlet-name>spring-mvc</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/spring-mvc-servlet.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>spring-mvc</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
</web-app>
Can any one help me to solve this issue?
You have 3 problems:
1: In your Maven project, the folder src/main/resources has a special meaning for Maven: its content will be put in the classpath after compiling.
2: when you use spring resources mapping then the part of the url that mapping that match the mapping part '**' will been added to the location part for obtaining the file. (sorry for the bad explanation) An example will make it more clear: assume you have this resource mapping
<mvc:resources mapping="/a/**" location="/b/c/" >
And you request the url http://localhost/myApp/a/d then spring will look for the file at /b/c/d! - So when you send an request for ....../resources/themes/css/bootstrap.min.css Spring would search for: /resources/theme/themes/css/bootstrap.min.css
3: in spring config and folder you use theme but in the jsp you use themes
Solution for 1 would be: either you change the location spring resource mapping to pick up the resource from classpath by using classpath: prefix in location attribute or you put your files in an other folder: source/main/webapp/resources/theme (then the location parameter /resources/theme/) would map.
example with classpath fix for 1 and one possible fix for 2:
<mvc:resources mapping="/resources/theme/**"
location="classpath:/resources/theme/" cache-period="31556926"/>
jsp - fix for 3:
<link href="<c:url value="/resources/theme/css/bootstrap.min.css"/>"
rel="stylesheet" type="text/css"/>
Probably is this:
You have this configuration
<mvc:resources mapping="/resources/**" location="/resources/theme/"
But when you call the resourcek, you use this
<c:url value="/resources/themes/css/bootstrap.min.css"/
i htink you have to use this
/resources/css/bootstrap.min.css
If a resource need visible by a frontend, you need put the resources in "webapp" folder. Example: webapp/theme/css/bootstrap.min.css
I have create a skeleton project for Spring MVC (static resources are used also) here.

Images not found in Spring - can not find resources folder

I have the following folder structure. I added mvc annotation and resources path but when I try call the resources in home.jsp like <img src= "/resources/images/spitter_avatar.png" />, it can't find anything.
Folder structure:
Here is my code in my servlet-config.xml file for resources:
<mvc:annotation-driven/>
<mvc:resources mapping="/resources/**" location="/resources/" />
<img src= "resources/images/spitter_avatar.png" />
try above remove "/" before resources
if you wanted to start with / , then use JSTL C tag
<img src= "<c:url value="/resources/images/spitter_avatar.png"></c:url>" />
The resources folder must be located inside the WebContent folder.
Place ${pageContext.request.contextPath} before your items url on the jsp page. Example:
${pageContext.request.contextPath}/resources/images/springlogo.svg

Import extJs to JSP

I am using Spring tool suite and I created MVC application. Now I'd like to move to ExtJs with this concept.
But I am not able to include extJs files into JSP.
My servlet looks like this:
<mvc:resources mapping="/resources/**" location="/resources/" />
<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<beans:property name="prefix" value="/WEB-INF/views/" />
<beans:property name="suffix" value=".jsp" />
</beans:bean>
<context:component-scan base-package="net.codejava.spingextjs" />
my JSP looks like this:
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%# page session="false" %>
<html>
<head>
<link href="resources/css/ext-all.css" rel="stylesheet">
<script src="extjs/ext-debug.js" type="text/javascript"></script>
<script src="app/app.js" type="text/javascript"></script>
</head>
<body>
</body>
Folder tree looks like this:
However page won't load and firelogger says that /extjs/ext-debug.js and app/app.js is not located on server (404 on these files). I use tomcat and trying it on localhost.
So my question is, what should I do to import ExtJs in JSP, or should I change home.jsp to home.html (tried this, didn't helped)?
I already made the ExtJs app using static web page and loading in html, however I am not able to force server to load ExtJs using MVC concept.
Your js/css/images need to be located in the resources folder.
There are a bunch of examples of using ExtJS with Spring MVC out there:
https://github.com/loiane/extjs-crud-grid
It relies on an older version of Ext but it's a nice boilerplate.
Cheers
You may need to MOVE extjs/ext-debug.js and app/app.js into the resources directory because the other locations will be handled by a dispatcher servlet.
OR, if you do not want to move these files, then add two line in your servlet configuration.
<mvc:resources mapping="/resources/**" location="/resources/" />
<mvc:resources mapping="/extjs/**" location="/extjs/" />
<mvc:resources mapping="/app/**" location="/app/" />
<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<beans:property name="prefix" value="/WEB-INF/views/" />
<beans:property name="suffix" value=".jsp" />
</beans:bean>
<context:component-scan base-package="net.codejava.spingextjs" />
If it does not solve the problem after you have moved or added two lines in the configuration file, then try the jstl c:url tag like below.
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%# page session="false" %>
<html>
<head>
<link href="<c:url value='/resources/css/ext-all.css' />" rel="stylesheet">
<script src="<c:url value='/extjs/ext-debug.js' />" type="text/javascript"></script>
<script src="<c:url value='/resources/css/ext-all.css' />app/app.js" type="text/javascript"></script>
</head>
<body>
</body>

Spring MVC - include static files / javascript , css

I have created MVC application.
I want to include js or css file into jsp.
My static files ar under:
- webapp
-js/jquery.js
-WEB-INF|
|
- jsp/*.jsp
My code to include jquery is:
<script type="text/javascript" src="<c:url value="js/jquery.js" />"></script>
and i cant load the js file into view.
I see the logs with info:
WARN : org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/pool/js/jquery.js] in DispatcherServlet with name 'appServlet'
what means, that MVC try to map url to js file.
I think that there is something with my configuration, but i don't know what.
my web.xml is:
<?xml version="1.0" encoding="UTF-8"?>
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<!-- The definition of the Root Spring Container shared by all Servlets and Filters -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/spring/root-context.xml</param-value>
</context-param>
<!-- Creates the Spring Container shared by all Servlets and Filters -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<!-- Processes application requests -->
<servlet>
<servlet-name>appServlet</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<init-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/spring/appServlet/servlet-context.xml</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>appServlet</servlet-name>
<url-pattern>/*</url-pattern>
</servlet-mapping>
<filter>
<filter-name>hibernateFilter</filter-name>
<filter-class>org.springframework.orm.hibernate3.support.OpenSessionInViewFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>hibernateFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
add this to you confing and modify the location according to your need.
<mvc:resources mapping="/static/**" location="/WEB-INF/static/"/>
see this How to handle static content in Spring MVC?
Change your DispatcherServlet mapping to e.g:
<servlet-mapping>
<servlet-name>appServlet</servlet-name>
<url-pattern>*.jsp</url-pattern>
</servlet-mapping>
Or some other not conflicting url-pattern like *.htm or /controllers/*. Remember that from now on all your controllers will be available only through this pattern.
Now it is intercepting everything in your web application, including .js files, images, etc.
The same thing with hibernateFilter - you don't really need an open Hibernate session when fetching .js files, don't you?
Why not use the simple jsp core ?
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<link rel="stylesheet" type="text/css" href="<c:url value='/resources/css/bootstrap.css'/>" />
Use spring JSTL tags to include external script files or style sheets.
First you should include the the taglib in JSP as follows.
<%# taglib uri="http://www.springframework.org/tags" prefix="spring"%>
Then you can include extenal script file using,
<script type="text/javascript" src="<spring:url value="/js/jquery.js"/>"></script>
I agree with your answer. But in the style.css file declare url that relate to path of image.
--style.css--
.cwt-object0
{
display: block;
left: 2.62%;
margin-left: -1px;
position: absolute;
top: 43px;
width: 64px;
height: 64px;
background-image: url('/resources/images/object0.png');
background-position: 0 0;
background-repeat: no-repeat;
z-index: 0;
}
How to use tag <spring:url></spring:url> in style.css file to see in browser IE/Firefox
--jsp file ---
<link href="<spring:url value="/resources/style.css"/>" rel="stylesheet" type="text/css" media="screen">
add mvc:resources in your config file(*-servlet.xml), you can find it works
I just followed Mkyong Tutorial to place css, js, jquery & image files. Its working for me.
In servlet-context.xml
<!-- Handles HTTP GET requests for /resources/** by efficiently serving
up static resources in the ${webappRoot}/resources directory -->
<resources mapping="/resources/**" location="/resources/assets/" />
In JSP , import tag library
<%# taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
and add like
<link rel="stylesheet" href="<c:url value='/resources/css/custom.css'/>">

Resources