Inconsistency in the mapping of resources in a Spring project - spring

In my Spring project, one of the my controllers have the following views:
login -> /WEB-INF/jsp/acesso/login.jsp
logout -> /WEB-INF/jsp/acesso/logout.jsp
start -> /WEB-INF/jsp/acesso/start.jsp
which are working almost fine, except with this little problem with the the first view (login):
When I call it for the first time (aka, when I start the application), the page is displayed correctly. But after I call logout from inside start, I have a link to login. When I click in this link, the view login is displayed wrong, without reach none of the css files included in the html code.
The JSP files above are:
login.jsp
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>HorarioLivre - Login</title>
<link href="<c:out value="bootstrap/css/bootstrap.min.css"/>" rel="stylesheet">
<link href="<c:out value="extras/css/signin.css"/>" rel="stylesheet">
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
</head>
<body>
<div class="container">
<form class="form-signin" role="form" method="post" action="<c:out value="acesso/doLogin.html"/>">
<h2 class="form-signin-heading">Please sign in</h2>
<input type="text" class="form-control" name="username" placeholder="Username" required autofocus>
<input type="password" class="form-control" name="password" placeholder="Password" required>
<button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
</form>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
</body>
</html>
start.jsp
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>HorarioLivre</title>
<!-- Bootstrap core CSS -->
<link href="<c:out value="../bootstrap/css/bootstrap.min.css"/>" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="<c:out value="../extra/css/starter-template.css"/>" rel="stylesheet">
<script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">HorarioLivre</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li>Eventos</li>
<li>Listar Horários</li>
<li>Cadastrar Horários</li>
<li>Usuários</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
${usuario.primeiroNome} ${usuario.ultimoNome}<b class="caret"></b>
<ul class="dropdown-menu">
<li>Perfil</li>
<li>Configurações</li>
<li>Sair</li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="container">
<div class="starter-template">
</div>
</div><!-- /.container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="<c:out value="../jquery/js/jquery-2.1.0.min.js"/>"></script>
<script src="<c:out value="../jquery/js/jquery-ui-1.10.4.custom.min.js"/>"></script>
<script src="<c:out value="../bootstrap/js/bootstrap.min.js"/>"></script>
</body>
</html>
logout.html
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Saida do sistema</title>
<!-- Bootstrap core CSS -->
<link href="<c:out value="../bootstrap/css/bootstrap.min.css"/>" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="<c:out value="../extra/css/jumbotron-narrow.css"/>" rel="stylesheet">
<script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
</head>
<body>
<div class="container">
<div class="header">
<h3 class="text-muted">HorarioLivre</h3>
</div>
<div class="jumbotron">
<h1>Você saiu do sistema</h1>
<p class="lead"></p>
<p><a class="btn btn-lg btn-success" href="<c:out value="login.html"/>" role="button">Entrar novamente</a></p>
</div>
<div class="footer">
<p>Kleber Mota de Oliveira © 2014</p>
</div>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
</body>
</html>
Someone knows how to correct set the mapping for this files, to work don't matter how it's called?
ps.: my web.xml is:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
<display-name>HorarioLivre2</display-name>
<welcome-file-list>
<welcome-file>acesso/login.html</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>HorarioLivre2</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>HorarioLivre2</servlet-name>
<url-pattern>*.html</url-pattern>
</servlet-mapping>
</web-app>
my HorarioLivre2-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"
xmlns:tx="http://www.springframework.org/schema/tx"
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-3.0.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-2.0.xsd">
<context:component-scan base-package="com.horariolivre"/>
<bean id="viewResolver" class="org.springframework.web.servlet.view.UrlBasedViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.JstlView" />
<property name="prefix" value="/WEB-INF/jsp/" />
<property name="suffix" value=".jsp" />
</bean>
<context:annotation-config>
<bean class="com.horariolivre.resources.HibernateConfig">
</bean>
</context:annotation-config>
<tx:annotation-driven transaction-manager="transactionManager"/>
</beans>

In your HorarioLivre2-servlet.xml it seems that you have not mapped the static resources. Check out this link to see how this is done

Related

jsp files not getting updated

I'm going to create a website using Spring.
So I created a jsp file, but no matter how I change the source code from today, the jsp file will not be updated.
This is my jsp code
<%# page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%# taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
</head>
<body id="page-top">
<!-- jQuery 사용을 위한 include, 항상 최상단에 위치해 있어야 함 -->
<jsp:include page="common/jQuery.jsp"/>
<!-- servletPath가 만약 true라면 아래 진입 -->
<!-- Page Wrapper -->
<div id="wrapper">
<!-- 사이드 네비바 파일을 가져와서 include 시켜줌, 사이드 네비바는 무조건 div id 가 wrapper안에 있어야 함 -->
<jsp:include page="common/side_nav.jsp"/>
<c:if test="${ pageName eq 'noticePage' }">
<script>
$(document).ready(function() {
$("#accordionSidebar").children(".nav-item").eq(0).removeClass("active");
$("#accordionSidebar").children(".nav-item").eq(2).addClass("active");
$('#summernote').summernote({
height: 500,
lang: "ko-KR"
});
});
</script>
</c:if>
<!-- Content Wrapper -->
<div id="content-wrapper" class="d-flex flex-column">
<!-- Main Content -->
<div id="content">
<!-- Top bar 부분을 가져와서 사용함, Top bar는 무조건 content안에 있어야 함-->
<jsp:include page="common/top_bar.jsp"/>
<!-- Begin Page Content -->
<div class="container-fluid">
<!-- DataTales Example -->
<div class="card shadow mb-4">
<div class="card-header py-3">
<h4 class="m-0 font-weight-bold text-primary">공지사항항항</h4>
</div>
<div class="card-body" style="height:auto">
<form method="post">
<input type="text" placeholder="제목"/>
<div id="summernote"></div>
</form>
</div>
</div>
</div>
<!-- /.container-fluid -->
</div>
<!-- End of Main Content -->
<!-- Footer 부분 이건 content-wrapper 제일 아래에 위치시키도록 하자-->
<jsp:include page="common/footer.jsp"/>
<!-- End of Footer -->
</div>
<!-- End of Content Wrapper -->
</div>
<!-- End of Page Wrapper -->
<!-- 맨위로 올라가게 해주는 토글 버튼과 우측 상단로그아웃 부분. 이건 항상 body의 제일 아래부분에 있도록 위치시키자 -->
<jsp:include page="common/logout_scroll.jsp"/>
<!-- summernote cdn 시작-->
<link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.12/summernote-lite.js"></script>
<!-- summernote cdn 끝 -->
</body>
</html>
I checked the page source on Google Chrome, but the tag was not added to the source after rebooting the local server many times.
I searched a lot and found that source freezing occurred.
So I checked the work file in the following path, but the work file is empty.
C:\dev\apache-tomcat-9.0.58-windows-x64\apache-tomcat-9.0.58\work
Also, I checked the work file in the following path, but it is also empty.
C:\workspace3\.metadata\.plugins\org.eclipse.wst.server.core\tmp1\work
How can I solve this problem?

Vue components not loading but router-views loads normally

I'm trying to figure out why on earth I can load my component through router-view but not by calling the component itself.
In my blade file when I write '<router-view />', It loads my CategoryDropdown component normally but when I write CategoryDropdown It disappears and I get this console error:
'app.js:7307 [Vue warn]: Failed to resolve component: categorydropdown
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.
at <App>'
Here is the code for my app.js:
require("./bootstrap");
import Alpine from "alpinejs";
window.Alpine = Alpine;
Alpine.start();
import { createApp } from "vue";
import router from "./router";
import CategoryDropdown from "./components/categories/CategoryDropdown";
import vClickOutside from "click-outside-vue3";
createApp({
components: {
CategoryDropdown,
},
})
.use(router, vClickOutside)
.mount("#app");
Here is the blade file noting that if i simply replaced this with it will work:
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<header class="max-w-xl mx-auto mt-10 text-center">
<h1 class="text-4xl">
<span class="bg-gradient-to-r from-green-300 via-blue-500 to-purple-600 px-2 py-1 rounded-xl text-white">
Hands On Tech</span>
blog
</h1>
<h2 class="inline-flex mt-2 items-center">
By Mostafa Said
<img class="wavingHand" src="/images/wavinghand.png" width="35px" alt="Waving Hand" />
</h2>
<p class="text-sm mt-5">
Come'on in and check out my latest blog posts. I'm sharing whatever on
my mind and my mind is full of useful stuff for you'all.
</p>
<div class="space-y-2 lg:space-y-0 lg:space-x-4 mt-8">
<!-- Category -->
<div class="override relative lg:inline-flex items-center bg-blue-100 rounded-xl">
<CategoryDropdown />
<!-- This works -->
<!-- <router-view /> -->
</div>
<!-- Search -->
<div class="override flex lg:inline-flex items-center bg-blue-50 rounded-xl px-3 py-2">
<form method="GET" action="#">
<input type="text" name="search" placeholder="Looking for something?" class="shadow-none focus:shadow-none bg-transparent placeholder-black text-sm border-none outline-hidden" />
</form>
</div>
</div>
</header>
This is the layout:
<!DOCTYPE html>
<html lang="en" class="scroll-smooth">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="High quality Web Development articles" />
<meta property="og:title" content="Hands On Tech Blog" />
<meta property="og:description" content="High quality Web Development articles" />
<meta property="og:type" content="website" />
<meta property="og:image" content="http://" />
<meta property="og:url" content="https://" />
<title>Hands On Tech Blog</title>
<link rel="stylesheet" href="{{ asset('/css/app.css') }}" />
<link rel="stylesheet" href="/override.css" />
<script src="{{ asset('js/app.js') }}" defer></script>
</head>
</html>
I want to be able to see my component when I call it in blade like this '' instead of using ''

Laravel blade. Blade doesn't work

I have route
Route::get("/prodByCat/{category_id}", "ProductController#productsByCategory")->name("product.productsByCategory");
and function
public function productsByCategory($category_id){
$products = Product::where('category_id', $category_id)->get();
return view("cat", compact("products"));
in my template i have only
#extends("index")
#section("content")
#foreach($products as $product)
{{ $product->name }}
#endforeach
#endsection
Problem is - links to bootstrap and custom css doesn't inherits. I tried to create another controller and new template file. But nothing works, except deleting {category_id} from Route. Why passing {category_id} conflicts with links to css files?
I tried composer dump-autoload and reboot computer.All other templates work properly.
My index template
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>#yield("title")</title>
#yield("css")
<!-- Bootstrap core CSS -->
<link href="files/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="files/shop-homepage.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
#include("layouts._shopNav")
<!-- Page Content -->
<div class="container">
<div class="row">
<div class="col-lg-3">
#yield('category')
</div>
<!-- /.col-lg-3 -->
<div class="col-lg-9">
#yield("carousel")
<div class="row">
#yield("content")
</div>
<!-- /.row -->
</div>
<!-- /.col-lg-9 -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="fixed-bottom py-3 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Some writing<br></p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="files/jquery/jquery.min.js"></script>
<script src="files/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>
The problem is that the wrong path of the css files. You can use
{{ asset('files/jquery/jquery.min.js') }}
to make sure that the path is correct.

spring MVC MAVEN: Static resource With 404

I have searched for this but didn't get the solution for the same. I got information i.e. we have to use <mvc:resources location="/resources/" mapping="/resources/**"/> and place all the static member like css/img/js inside resources folder
src
|--main
| |
| |--java
| |--resources
| |--webapp
And then we have to use either jstl or spring tags to map the resources as below:
<head>
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<spring:url value="/resources/LoginForm.css" var="loginCss" />
<link rel="stylesheet" href="${loginCss}" type="text/css" />
</head>
I have developed some code by keeping all the points in mind but getting 404 error for static resources.
click here for project structure
code for dispatcher 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-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-3.0.xsd
">
<mvc:annotation-driven/>
<context:component-scan base-package="com.anand" />
<bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix">
<value>/WEB-INF/views/</value>
</property>
<property name="suffix">
<value>.jsp</value>
</property>
</bean>
<bean id="messageSource" class="org.springframework.context.support.ReloadableResourceBundleMessageSource">
<property name="basename" value="/WEB-INF/messages" />
</bean>
<mvc:resources location="/resources/" mapping="/resources/**"/>
<mvc:default-servlet-handler />
</beans>
Code for loginform.jsp
<%# page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%# taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%# taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Home-Login</title>
<spring:url value="/resources/LoginForm.css" var="loginCss" />
<spring:url value="/resources/logo1.PNG" var="logo1" />
<spring:url value="/resources/img1.png" var="img1" />
<spring:url value="/resources/img2.png" var="img2" />
<spring:url value="/resources/img3.png" var="img3" />
<link rel="stylesheet" href="${loginCss}" type="text/css" />
</head>
<body class="login">
<!-- header starts here -->
<div id="facebook-Bar">
<div id="facebook-Frame">
<div id="logo"> <img src="${logo1}" /></div>
<div id="header-main-right">
<div id="header-main-right-nav">
<form:form action="loginform.html" method="post" commandName="loginform">
<table border="0" style="border:none">
<tr>
<td ><form:input type="text" tabindex="1" path="userName" placeholder="UserName" class="inputtext radius1" value="" /></td>
<td ><form:input type="password" tabindex="2" path="password" placeholder="Password" class="inputtext radius1" /></td>
<td ><input type="submit" class="fbbutton" name="login" value="Login" /></td>
</tr>
<tr>
<td><label>
<input id="persist_box" type="checkbox" name="persistent" />
<span style="color:#ccc;">Keep me logged in</span></label></td>
<td><label>forgot your password?</label></td>
</tr>
</table>
</form:form>
</div>
</div>
</div>
</div>
<div class="slideshow-container" style="width:100%;height:80%; min-width:1000px;">
<div class="mySlides fade" style="width:100%;height:100%">
<div class="numbertext">1 / 3</div>
<img src="${img1}" style="width:100%;height:100%" />
<div class="text">Caption Text</div>
</div>
<div class="mySlides fade" style="width:100%;height:100%">
<div class="numbertext">2 / 3</div>
<img src="${img2}" style="width:100%;height:100%" />
<div class="text">Caption Two</div>
</div>
<div class="mySlides fade" style="width:100%;height:100%">
<div class="numbertext">3 / 3</div>
<img src="${img3}" style="width:100%;height:100%" />
<div class="text">Caption Three</div>
</div>
</div>
<br/>
<div style="text-align:center">
<span class="dot"></span>
<span class="dot"></span>
<span class="dot"></span>
</div>
<script>
var slideIndex = 0;
showSlides();
function showSlides() {
var i;
var slides = document.getElementsByClassName("mySlides");
var dots = document.getElementsByClassName("dot");
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex> slides.length) {slideIndex = 1}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" active", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
setTimeout(showSlides, 2000); // Change image every 2 seconds
}
</script>
</body>
</html>
When it redirects me to loginform.jsp and i do F12-->network analysis, it shows me 404 for static resources like ,img1,img2,img3,logo1 and for .css file.
Click Here for F12 debug and chrome view of page without css
[[Solved]]: Finally solved the problem but i'm not sure the approach i have used here is correct or not but yeah it's working for me. Solution: i have copied the resources folder under webapp folder (i.e. WEB_INF & resources are siblings).
Click here for updated directory structure image
Please do provide better solution of this if you have for the same:
Resources inside WEB-INF are protected to be not accessible directly from the client.
In general, if it is static resources such as html, CSS, JavaScript can be placed outside WEB-INF. Static content placed outside can be therefore downloaded directly from the client browser.
Pls read Referencing a resource placed in WEB-INF folder in JSP file returns HTTP 404 on resource

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

This is the dispatcher-servlet.xml:
<?xml version="1.0" encoding="UTF-8"?>
<beans:beans xmlns="http://www.springframework.org/schema/mvc"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:beans="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop"
xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.2.xsd
http://www.springframework.org/schema/aop
http://www.springframework.org/schema/aop/spring-aop-3.2.xsd
http://www.springframework.org/schema/tx
http://www.springframework.org/schema/tx/spring-tx-3.2.xsd">
<mvc:annotation-driven />
<context:component-scan base-package="com.web.controllers" />
<mvc:resources mapping="/resources/**" location="/resources/" />
<!-- <mvc:default-servlet-handler /> -->
<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>
</beans:beans>
<%# page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%# taglib prefix="core" uri="http://java.sun.com/jsp/jstl/core" %>
<%# taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%# taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<!DOCTYPE html>
<html>
<head>
<title>mypage</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="${pageContext.request.contextPath}/WebContent/resources/mycustom/fabrication.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/WebContent/resources/mycustom/boxmodel.css" rel="stylesheet">
<link href="<c:url value="/resources/css/bootstrap.min.css" />" rel="stylesheet">
<link href="${pageContext.request.contextPath}/WebContent/resources/css/moslake_style.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/WebContent/resources/css/boxmodel.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/WebContent/resources/css/font.css" rel="stylesheet">
<link href="${pageContext.request.contextPath}/WebContent/resources/css/media.css" rel="stylesheet">
<script src="<c:url value="/resources/js/jquery.min.js" />"></script>
<script src="<c:url value="/resources/js/bootstrap.min.js" />"></script>
</head>
<body bgcolor="#F5FAFA">
<h1>${pageContext.request.contextPath}</h1>
<div class="header">
<div class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="row">
<div class="col-md-5"></div><!--end of first row columns-->
<div class="col-md-2">
<a class="navbar-brand" href="#"><img src="img/swing.png" alt="swing logo" height="50" width="100"></a>
</div>
<div class="col-md-5"></div>
</div><!--end of row-->
<div class="row">
<div class="col-md-5">
<ul class="nav nav-pills">
<li>
<button class="dropdown-toggle btn-primary btn-sm" data-toggle="dropdown" type="button">
<span class="glyphicon glyphicon-menu-hamburger"></span>
</button>
<ul class="dropdown-menu">
<li><p align="center">Projects List</p></li>
<li class="divider"></li>
<li><b>Project1</b></li>
<li><b>Project2</b></li>
<li><b>Project3</b></li>
<li><b>Project4</b></li>
<li><b>Project5</b></li>
</ul>
</li>
<li class="dropdown">
<button type="button" class="dropdown-toggle btn-primary btn-sm" data-toggle="dropdown">
<span class="glyphicon glyphicon-plus"></span>
</button>
<ul class="dropdown-menu">
<li><p align="center">Add</p></li>
<li class="divider"></li>
<li><b>New Project</b></li>
</ul>
</li>
<li>
<form class="navbar-search" id="srch" action="#">
<input type="text" class="form-control" placeholder="Search">
</li>
<li>
<button class="btn btn-primary btn-md" type="submit"><span class="glyphicon glyphicon-search"></span>Search</button>
</form>
</li>
</ul>
</div><!--end of col-md-5-->
<div class="col-md-4"></div><!--end of col-md-4-->
<div class="col-md-3">
<ul class="nav nav-pills">
<li>
<a class="btn btn-basic">hello!
<span class="badge">Abbas Kapasi</span>
</a>
</li>
<li class="dropdown">
<button class="dropdown-toggle btn-primary btn-sm" data-toggle="dropdown"><i class="glyphicon glyphicon-user"></i> <i class="glyphicon glyphicon-chevron-down"></i></button>
<ul class="dropdown-menu">
<li>Profile</li>
<li class="divider"></li>
<li>Logout</li>
</ul>
</li>
</ul>
</div><!--end of col-md-3-->
</div><!--end of nested row-->
</div><!--end of main container-->
</div><!--end of nav-->
</div><!--end of header-->
</body>
</html>
This causes following error:
org.springframework.beans.factory.parsing.BeanDefinitionParsingException: Configuration problem: Cannot locate BeanDefinitionParser for element [resources]
Offending resource: ServletContext resource [/WEB-INF/containers/dispatcher-servlet.xml]

Resources