Plain html5 vs MVC razor security - html

I am not sure about it which one is more secure either plain Html 5 or MVC razor view. I guess perhaps it is MVC razor view as it encodes the string. Please suggest which is better way

What do you mean about security?
Razor - its engine which transform "template" to html. So thats mean if you print in razor template you will have it in output of html.
Well if we talk about cross side scripting first of all it depends how you do stuff in you application. But by default razor has fixed that. so lets say if you want print variable which contain HTMl it will escape that, but if you are sure that you want print raw you must use helper for that.
var html = "<script>alert(1)</script>"
#html //it will print "<script>alert(1)</script>"
#Html.Raw(html) will print what you want
So generally i would say that Razor "is a bit more secure" than plain html. So its not security its just one more layer

Related

HTML Entities Encoder in JSP

I want to use an HTML Entity Encoder for my HTML <div>${data}</div>
I was using ESAPI library ESAPI.encoder().encodeForHTML But I am not sure if it is correct, because for instance, the result of encoding test/a/2 using ESAPI.encoder().encodeForHTML is test/a/2 (that's what I see in my JSP using :
<div><esapi:encodeForHTML>${deviceKey}</esapi:encodeForHTML></div>
but on this site http://www.web2generators.com/html-based-tools/online-html-entities-encoder-and-decoder the result is test/a/2 (?!) Why ?
ESAPI is almost unsupported due to a lack of interest in maintaining the platform; we'd love to have more active developers.
If you're doing active Ajax replacing of divs, you should look into safe templating and SCE in AngularJS as a replacement for ESAPI.
https://docs.angularjs.org/api/ngSanitize/service/$sanitize
https://docs.angularjs.org/api/ng/service/$sce

How to use Thymeleaf th:text in reactJS

I am running a springboot application with Thymeleaf and reactJS. All the HTML text are read from message.properties by using th:text in the pages, but when I have th:text in reactJS HTML block, reactJS seems angry about it.
render() {
return (
<input type="text" th:text="#{home.welcome}">
)
}
The error is:
Namespace tags are not supported. ReactJSX is not XML.
Is there a walkaround besides using dangerouslySetInnerHTML?
Thank you!
There is no sane workaround.
You are getting this error because Thymeleaf outputs XML, and JSX parsers do not parse XML.
You did this because JSX looks very, very similar to XML. But they are very, very different, and even if you somehow hacked Thymeleaf to strip namespaced attributes and managed to get a component to render, it would be merely a fleeting moment of duct-taped-together, jury-rigged code that will fall apart under further use.
This is a really, really bad idea because JSX is Javascript. You are generating Javascript on the fly. Just to name a few reasons this will not work in the long term:
This makes your components difficult if not impossible to test.
Reasoning about application state will be a nightmare as you will struggle to figure out if the source of a certain state is coming from Thymeleaf or JS.
Your application will completely grind to a halt if Thymeleaf outputs bad JS.
These problems will all get worse with time (Thyme?) as as developers abuse the ease with which they can render server-side data to the client-side, leading to an insane application architecture.
Do not do this. Just use Thymeleaf, or just use React.
Sample Alternative: I primarily work on a React application backed by a Java backend. So I understand how someone could stumble upon this hybrid and think it might be a good idea. You are likely already using Thymeleaf and are trying to figure out how you can avoid rewriting your servlets but still get the power of React.
We were in a similar boat two years ago, except with an aging JSP frontend, but the difference is negligible. What we did (and it works well) is use a JSP page to bootstrap the entire React application. There is now one JSP page that we render to the user. This JSP page outputs JSON into a single <script> tag that contains some initial startup data that we would otherwise have to fetch immediately. This contains resources, properties, and just plain data.
We then output another <script> that points to the location of a compiled JS module containing the entire standalone React application. This application loads the JSON data once when it starts up and then makes backend calls for the rest. In some places, we have to use JSP for these, which is less than ideal but still better than your solution. What we do is have the JSP pages output a single attribute containing JSON. In this way (and with some careful pruning by our XHR library) we get a poor man's data interchange layer built atop a JSP framework we don't have time to change.
It is definitely not ideal, but it works well and we have benefited vastly from the many advantages of React. When we do have issues with this peculiar implementation, they are easy to isolate and resolve.
It is possible wrap ReactJS apps in Thymeleaf. Think if you want a static persistent part (like some links, or even just displayed data), you could use Thymeleaf. If you have a complicated part (something that requires DOM repaints, shared data, updates from UI/Sockets/whatever), you could use React.
If you need to pass state you could use Redux/other methods.
You could have your backend send data via a rest API to the React part and just render your simple parts as fragments or as whole chunks of plain HTML using Thymeleaf.
Remember, Thymeleaf is really just HTML. React is virtual DOM that renders as HTML. It's actually fairly easy to migrate one to the other. So you could write anything "Static" or that does not respond much to UI, in Thymeleaf/HTML. You could also just render those parts in React too, but without State.
Thymeleaf 3 allows you to render variables from your Java to a separate JS file. So that is also an option to pass into JSX
function showCode() {
var code = /*[[${code}]]*/ '12345';
document.getElementById('code').innerHTML = code;
}
Now you can use data- prefix attributes (ex. data-th-text="${message}").
https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#support-for-html5-friendly-attribute-and-element-names

My backbone marionette model contains a field with escaped html in it. How do I render that field's contents as HTML and not text?

Classic problem. Want to see html rendered but I'm seeing text in the browser. Whether I tell handlebars js to decode it or not in template ( three curly braces vs two - {{{myHtmlData}}} vs {{myHtmlData}} ) doesn't get me there. Something about the JSON being returned via the model.fetch() has this html data wrapped up in such a way that it is resistant to the notion of displaying as HTML. It's always considered a string whether encoded or decoded so it always displays as text.
Is this just something backbone isn't meant to do?
The technologies involved here are:
backbone.marionette
handlebars.js
.NET Web API
Your data is being escaped automatically. It's a good thing, but since you're sure the data is a safe HTML. Use {{{}}} as in this other question Insert html in a handlebar template without escaping .

Spring Localization with html

I have created a spring application with multiple language support, using spring localization/Internationalization and jstl. Now I am going to remove all the jsp and replace it with html. Can make use of spring localization/Internationalization and resource bundles in pure html without jstl? (I am sure there has to be a way.)
You can get rid of JSTL if that's what you are asking for. After all, Spring has its own <sp:message> tag.
However, if you want to get rid of JSP completely and only serve static HTML, I am afraid it can't be done correctly.
That is, you can possibly generate the whole page with JavaScript (i.e. jQuery), but how useful is that?
And you'll be forced to implement some means of Localization for JavaScript anyway. I mean you'll probably need to generate file with translations on-the-fly.
It's do-able, but it would be extremely easy to introduce for example concatenation defects (that won't allow for re-ordering the sentence, that is proper translations).
To summarize this: you probably can do that, but you probably should not.
It is possible..with minimum tweaks..
Dont remove jSP,JSTL etc..
Convert each submit request to ajax..A server doesnt care whether a request is a normal browser submit request or XMLHttpRequest(ajax)..server will use JSP,JSTL to prepare appropriate HTML..u need ajax to render that html string into DOM.
$.ajax(url:'/xyz',
success:function(htmlFromServer){
document.open();
document.write(htmlFromServer);
document.close();
});

What is the best way to create printable letters from an MVC application?

What's the best way to create printable letters from an MVC application? I'm looking for sort of a mail merge thing from my app that prints a form letter with various values filled in.
In ASP.NET, I previously did this by creating an HTML document and displaying it as application/msword, but I did that with code-behind, which isn't an (easy) option in MVC, and I don't know if that's the best method or not.
Note that this is an internal application, so it can be assumed everyone has Word on their computer. With that said, it would be nice to bypass Word, but I could go either way. The simpler the better. Any ideas/methods welcome.
Since this is just HTML with the ContentType set to application/msword I can't see any reason why you would want to use code-behind.
A standard MVC view with a typical HTML template peppered with appropriate <%=...> where view data needs to be inserted would seem to be the sensible approach. Even where you might want to loop.
BTW, why isn't code-behind an easy option?
In your controller:
return Content(contentGoesHere, "application/msword");