Spring JSP CSS referencing issues - spring

My team had all ready created a project in spring framework and running successfully. Now i decided to make it run even faster.
Existing project:
My developers do their best and created dynamically output css pages using jsp.
Existing code:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<jsp:include page="/WEB-INF/common/layout/head.jsp" />
< jsp:include page="/WEB-INF/common/css/index.jsp" />
</head>
Out put:
<style type="text/css">
body{background: #ffffff url('<c:url value='/resources/images/logo/logo_small.png'/>') no-repeat scroll center center}
</style>
There is no error in this code or project this is working fine.
What i need is that, my css files need to be loaded by a link tag in header. something like this:
<link rel="stylesheet" href="/mysite/resource/css/sitemap/index.css" type="text/css">
This will speed up by catching in browser.
What i done up to now:
I created a url it points to a jsp.
<c:if test="${branch == 'sitemap'}">
<c:if test="${page == 'index'}">
<%#include file="/myfile/dynamic/css/layout/index.jsp" %>
</c:if>
</c:if>
This code may? works, but there is a problem. I need to replace style type start tag and end tag.
I done that by, Importing and replacing by this code:
<c:set var="my_css">
<c:if test="${branch == 'sitemap'}">
<c:if test="${page == 'index'}">
<%#include file="/WEB-INF/common/css/index.jsp" %>
</c:if>
</c:if>
</c:set>
<c:set var="css" value='${fn:replace(fn:replace(fn:replace(my_css,"<style type=\\\"text/css\\\">", ""),"</style>", ""),"\'", "99999")}'/>
<compress:css enabled="true">
<c:out value='${css}'/>
</compress:css>
Here 99999 location is causing problem. Actually i need to replace it with & #39;.
The above code works fine and replaces ' with 9999. But after replace with &.. it not working. The & itself again changing to & amp;
Information :
Its a completed project. More css will be generated dynamically. All in jsp pages.
Goodluck is that each jsp page ouput only css code. Badluck is that it contains script tag at top and bottom. One more bad luck is on url('').
This ' code is doing the problem in fn:replace tag.
Or if you have a better suggestion please let me know.
I think there will be an easy option. Please let me know your suggestions, advice and help.

I achieved this.
I created a new route /resource/css|js , I use internal resource view resolver - (folder).
My link url is moething like /resource/css/qtn/page1.css.
In controller /resources/{type}/{page}.css.
Here i get type and page values and used this in my dynamic jsp page to achieve my result.
For security i checked the url is it comes from my own page or not.
Hint :
While using internal resource view resolver it will throw error when you pass page values directly to resource url because sometimes page url will be /page1/block1 so our controller throws error.
To solve this i passed page values as /resource/css/qtn/page1.css?sub=${page}.
In controller we can easily cath this sub value and send to our dynamic jsp as model.

Related

Why is "_csrf" attribute not resolved inside spring-boot velocity view <head> tags?

I have a Spring-Boot project with Velocity templating all configured and working fine...
In my velocity view, I have the following;
<head>
<!-- some other meta tags here -->
<meta name="csrf-token" content="$!_csrf.token">
</head>
Here's what the output looks like when I inspect in chrome;
<meta name="csrf-token" content="$!_csrf.token">
However on this same page I have a form that looks something like this;
<form method="post" action="/post/to/wherever">
<input type="hidden" id="csrf" name="$!_csrf.parameterName" value="$!_csrf.token" data-header="$!_csrf.headerName"/>
<!-- other fields here -->
</form>
And the browser inspection shows the following;
<input type="hidden" name="_csrf" value="69799b81-7c45-4042-9269-3a83769df682" data-header="X-CSRF-TOKEN">
So obviously, the _csrf attribute gets injected and resolved within the form body but not within the head meta tags.
QUESTION: What would cause a thing like this?
Ok I eventually found out that what was happening here was due to a very simple oversight.
I had the <head>...</head> section in a separate template and was including it to other templates as follows;
#include("/pages/common/header.vm")
Well, for users of velocity, it's quite obvious that the above just includes the template as-is (i.e all content is translated as text) and wouldn't resolve any velocity context attributes declared within. So I just needed to change it to the following
#parse("/pages/common/header.vm")
This ensures that any velocity attributes declared within the header.vm template are appropriately parsed and the values accordingly read.
I was initially going to delete the question thinking it shouldn't have been asked in the first place, but I realized, well this is StackOverflow, better to just point out the mistake and save somebody else some little time. Essentially, make the world a better place for everyone... Cheers!

Spring url tags with jsessionid

I have a jsp with the following (relevant) setup:
<s:url value="/res" var="res_url" />
<link href="${res_url}/less/bootstrap.less" rel="stylesheet/less">
<link href="${res_url}/less/responsive.less" rel="stylesheet/less">
...
Ive noticed a problem with using this technique, in that on the first page load of a new session my res_url variable will have ";jsessionid=xxxxxxxxx" appended. In this case that means the id appears in the middle of my stylesheet URL and therefore the stylesheets are not loaded.
I realize that I'm probably not using the URL tag in the way its intended, and that you can include param tags inside the URL tag to get around this, but I don't like the idea of it and think the way i did it was much cleaner. Is it possible to somehow tell it to ignore the jsessionid? Or is there any other way of doing this?
I don't see the benefit of using Spring's URL tag over the standard JSTL tag. What about
<c:url value="/res/less/bootstrap.less" var="lessBootstrap" />
<link href="${lessBootstrap}" rel="stylesheet/less">
If you want to define the /res/less path in a variable instead of repeating it you may do this like this:
<c:set var="resDir" value="/res/less" scope="request" />
The right way to do it is
<link href="<s:url value="/res/less/bootstrap.less"/>" rel="stylesheet/less">
<link href="<s:url value="/res/less/responsive.less"/>" rel="stylesheet/less">
I don't see what any simpler way to do it.

Load JSP:Include Based on Session Parameters (Using an MVC/Model 2 Approach)

I am doing some server side form validation and in the case that one or more of the fields is incorrectly filled out, an array gets populated with all of the error messages. On the client side, I have a scriplet that checks for the existence of any error messages and if there are any, it displays them. When the page comes from the servlet it knows if it has failed or not because on a successful submission, it would not reload the form jsp page at all.
This is how I am displaying the error:
<%if(request.getSession().getAttribute("errors") != null){ %>
<jsp:include page="error.jsp"></jsp:include>
<br>
<% } %>
And the error.jsp page is:
<%# page import="java.util.ArrayList" %>
<h3>Oops...We Have a Problem</h3>
Please review and fix the following errors.
<br>
<%
ArrayList errMessages = (ArrayList)request.getSession().getAttribute("errors");
for(int i=0; i<errMessages.size(); i++){
out.println(errMessages.get(i));
%>
<br>
This all works fine, but I am following the MVC/Model 2 Paradigm approach in where I keep the code confined to servlets and the html (display objects) confined to jsp pages. Obviously, this small example breaks the rules.
Is there a way to "pre-build" the jsp page on the servlet so it knows to display the error.jsp and I can do the whole array abstraction on the server? In this example it only seems like a tiny bit of code in the jsp that can't hurt, but in other examples I can see this code becoming a much larger section of the page and that is what I would like to avoid.
Just use taglibs instead of scriptlets to control the flow in JSP. JSTL is a standard JSP taglib and it offers flow control tags.
<c:if test="${not empty errors}">
<jsp:include page="error.jsp" />
</c:if>
and
<c:forEach items="${errors}" var="error">
<c:out value="${error}" /><br/>
</c:forEach>
See also:
How to avoid Java code in JSP files?

Image Pathing and Absolute Paths?

I'm developing a website in ASP .NET MVC 2 using C#.
I have a partial view, Header.ascx. In there I have an image for my website, MainImage.png.
When I use one of the primary Views I've created, the image shows up fine. For instance, I hit the Index ActionResult of my News Controller. (site.com/News)
However, when I dig deeper, I seem to lose my image, even though the Partial view is being displayed from the Master page. i.e., if I try going to site.com/News/Article/1
Are there any suggestions for keeping my image fully intact, such as a way to do absolute pathing?
The code I currently have in my partial view is here:
<div align="center"><img src="../Content/images/MainImage.png" style="border:none" /></div>
I've tried changing the src to ~/Content/images/MainImage.png but that breaks it all over the site.
Use the Url.Content helper method.
<img src="<%: Url.Content("~/content/images/imagename.png") %>" />
Same applies for when you want to include javascript files or css
<link rel="stylesheet" href="<%= Url.Content("~/content/site.css") %>" type="text/css" />
<script type="text/javascript" src="<%= Url.Content("~/content/scripts.js") %>"></script>
Whenever possible, make the path (href or src) to resource files, like images, CSS and JS relative to the web server root. That is, your URLs should begin with a slash:
<img src="/images/imagename.png" />
That format retains the current server address (which may be an IP address, an internal network address or any of a number of public web addresses), protocol and port, and doesn't depend on the apparent path of the page the user is looking at (which can change, depending on whether the user is accessing the page by its canonical location or by a URL rewrite).

Firefox not displaying the form

I'm using AJAX inside my JSF portlet. When the session expires, We are suppose to get the following message(this is the response of AJAX request when session expires)
This page is used to hold your data while you are being authorized for your request.
You will be forwarded to continue the authorization process. If this does not happen automatically, please click the Continue button below.
<CONTINUE BUTTON>
In IE 6 and 7 I can see the continue button. But in Firefox I don't see that button. Only the text is visible.But in the source code I can see that section, but it is grayed in Firebug.I've the screenshot uploaded to http://img31.imageshack.us/img31/619/firefoxcontinue.jpg
Ideally it should automatically forward the user to the login page, since AJAX cannot redirect that, it just displays the response.So Continue button has to be shown inside the portlet. Can someone please tell me why the HTML form is not shown in Mozilla Firefox.
Thanks
I created a test page. The problem is there when we try to insert the Form inside a table.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<BODY>
<script type="text/javascript">
function insertAjax(){
// alert('inside ajax');
document.getElementById("wpsportlet").innerHTML='This page is used to hold your data while you are being authorized for your request.<br/><br/>You will be forwarded to continue the authorization process. If this does not happen automatically, please click the Continue button below.<form action="http://www.google.com" method="get" name="AUTOSUBMIT"><input type="submit" value="Continue"/></form>';
}
</script>
<input type=button value="Submit" onclick="insertAjax();">
<div id="wpsportlet">
</div>
</BODY>
</HTML>
If I nest the form inside a table then the Form is not displayed in Firefox. Can someone please help a work around for this.
Your generated DOM is invalid. Character data (text) and <br>, <form> and <script> elements may not be child elements of elements - only <tbody>, <thead> and <tfoot> element may (although in XHTML you can have <tr> elements too).
For those elements to exist inside a table, they must appear entirely within a table cell.
Given broken HTML, Firefox will do a good job of compensating for author errors, but when the broken DOM is generated with JS, you bypass some of the autocorrection routines.
As an aside, your Doctype (HTML + Transitional + No system identifier) triggers Quirks mode - which doesn't generally help matters.
I suggest:
Switch to a Doctype that triggers Standards mode
Validate your markup
Build the content you are adding with JavaScript using plain HTML instead
Make that validate
Write JavaScript to generate the DOM you have now tested as being valid
Why don't you add a button using JavaScript when the response is shown to the screen?
This way should work on all browsers...
function addButton() {
//Create an input type dynamically.
var element = document.createElement('input');
//Assign different attributes to the element.
element.setAttribute('type', 'button');
element.setAttribute('value', 'Continue');
element.setAttribute('name', 'somename');
element.setAttribute('id', 'someid');
var foo = document.getElementById("fooBar");
//Append the element in page
foo.appendChild(element);
}

Resources