Rendering css and js in a Java web application using servlet
Question
In intellij IDEA, I started a new Java Web application and I am using servlets to handle GET and POST requests, now the problem comes in where I introduce CSS and JS in my JSP pages, they seem not to be rendered/ pulled from the sources and when I inspect the code in browser and click on the href or src links, I am redirected to the servlet error page, with this code
<!doctype html><html lang="en"><head><title>HTTP Status 404 – Not Found</title><style type="text/css">h1 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:22px;} h2 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:16px;} h3 {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;font-size:14px;} body {font-family:Tahoma,Arial,sans-serif;color:black;background-color:white;} b {font-family:Tahoma,Arial,sans-serif;color:white;background-color:#525D76;} p {font-family:Tahoma,Arial,sans-serif;background:white;color:black;font-size:12px;} a {color:black;} a.name {color:black;} .line {height:1px;background-color:#525D76;border:none;}</style></head><body><h1>HTTP Status 404 – Not Found</h1><hr class="line" /><p><b>Type</b> Status Report</p><p><b>Message</b> /post/MIS/assets/css/contracts-list.jsp</p><p><b>Description</b> The origin server did not find a current representation for the target resource or is not willing to disclose that one exists.</p><hr class="line" /><h3>Apache Tomcat/8.5.43</h3></body></html>
from my research I changed my links from
<link href="assets/css/style.css" rel="stylesheet">
to
<link href="${pageContext.request.contextPath}/assets/css/style.css" rel="stylesheet">
But the same problem (redirect to servlet errror page) still persists
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/bootstrap.min.css">
<!-- Material Design Bootstrap -->
<link href="${pageContext.request.contextPath}/assets/css/mdb.min.css" rel="stylesheet">
<!-- Your custom styles (optional) -->
<link href="${pageContext.request.contextPath}/assets/css/style.css" rel="stylesheet">
<!-- MDBootstrap Datatables -->
<link href="${pageContext.request.contextPath}/assets/css/addons/datatables.min.css" rel="stylesheet">
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/jquery-3.4.1.min.js"></script>
<!-- Bootstrap tooltips -->
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/popper.min.js"></script>
<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/bootstrap.min.js"></script>
<!-- MDB core JavaScript -->
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/mdb.min.js"></script>
<!-- MDBootstrap Datatables -->
<script type="text/javascript" src="${pageContext.request.contextPath}/assets/js/addons/datatables.min.js"></script>
I expect the page to render linked css and JS files but this redirects to servlet error page
1 answers
solution1
0 2019-09-09 16:56:46
By Analysing Your error,
HTTP Status 404 – Not Found ****** /post/MIS/assets/css/contracts-list.jsp
I got your problem,
1. You are not reading error messages sent by your intellij server.
2. Two mistakes in URL. a. context path /post/MIS but instead it should be /MIS b. assets/css/contract-list.jsp, I guess you are doing mistake while including your JSP(forwarding to JSP or redirecting to JSP).
There is nothing relation to css path to your 404 error. As css and js files loads after your jsp loads. Main entry only 404. Fix including contract-list.jsp, Rest of the things will work definitely.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.