Just a query, I have used #Html.Raw(Item.sometext) before and it decodes the html tags correctly, I'm getting some data from remore source which is in json format, but when displayed on the page I found Html.raw did not decodes html tags.
To fix the problem I used:
#Html.Raw(HttpUtility.HtmlDecode(Item.sometext))
So my question is, can anyone please tell me why that could be the case, as I'm curious as to the reason. Im using mvc4 and asp.net 4.5
Thanks
George
Here is my answer in an attempt to explain better what I mean (in the comments).
Your JSON is formatted for example (which you have supplied) like so:
<p><b>Location. <\/b> <br \/>...
However, this is not valid HTML. Notice the escape characters used for the slashes '/'. So if you pass this value to Html.Raw it will (should) output it, but it's not valid HTML so will unlikely display correctly (if it display anything at all).
This escape character issue can be fixed using Html.Decode which will effectively return the following:
<p><b>Location. </b> <br />...
This is valid HTML, and can therefore be passed to Html.Raw without any problems
NOTE: Html.Raw does not do any encoding/decoding, in fact it explicitly instructs that the supplied value should not be encoded as it is already raw HTML. This is confirmed here:
Use the Raw method when the specified text represents an actual HTML
fragment that should not be encoded and that you want to render as
markup to the HTTP response.
Related
I need an image loaded onto a html img tag using thymeleaf. The problem is, the image itself is obtained from a url which takes in two parameters.
Sample:
<img src="/products/images?categoryId=1&image=1" />
The trouble is, the image parameter is generated dynamically and hence I need to use a thymeleaf expression there. Therefore I tried something like this:
<img th:src="#{'/products/images?categoryId=1&image=' + ${product.id}}" />
But when I run this, I get the following message:
Exception parsing document: template="product-list", line 104 - column 59
Which points to the location where the '&' symbol occurs. Now, I have tried using '& amp;' but then, the url becomes something like
/products/images?categoryId=1&image=1
Obviously, this is not going to work.
So how else do I make a valid link with two parameters using thymeleaf then?
This can easily done by Thymeleaf. Don't concatenate strings and
simply use #{'/products/images'(categoryId=1, image= ${product.id})}
See the documentation.
The way that you escape an ampersand & in any html attribute is &. Actually you should always escape ampersands in all html attributes whether you are using Thymeleaf or not.
See this question for more details and references:
Do I encode ampersands in <a href...>?
I am developing a site in mvc4 where the content of the site includes both latin and cyrillic characters. Both are included in markup and both display correctly on screen.
However, within the markup, I have seen issues with cyrillic where url's for example are like following:
/%d1%81%d0%bf%d0%b8%d1%81%d0%be%d0%ba%20%d0%bf%d0%be%d0%b6%d0%b5%d0%bb%d0%b0%d0%bd%d0%b8%d0%b9
The url navigate correctly when clicked on, but incorrect in html markup. I have the meta charset set to utf-8 in a meta tag.
Any ideas whats causing this?
What you see is correct %-encoded (aka. URL-encoded) form of the URL “/список пожеланий” (as you can see using a decoder). Browser may display a URL in their address bar as %-encoded, or as decoded to characters. HTML authoring software or, in manual editing of HTML code, the author should take care of %-encoding anything that needs to be %-encoded at the HTTP protocol level, such as href attribute values.
I saw in a tutorial video that we should use Html.Encode in our views to prevent malicious injections. However, when the text that I'm encoding contains the ' character (for example Dog's) the output in the browser is Dog#39;s. I would have thought every potentially dangerous character would be remaped to some safe code that the browser would render correctly. Is this not the case? How can I get ' to show up in the browser but in an HTML safe way?
The # in Razor automatically encodes for you, meaning that you probably did a double encode.
Example:
#Html.Encode("This is \"safe\"")
is more or less the same as
#{Response.Write(Html.Encode(Html.Encode("This is \"safe\"")));}
Dunno if that last one works in Razor though.
If you are using ASP.NET MVC 2 <%: %> is already encoding the value for you
In Razor (MVC 3) # encodes the values for you so you do not need to wrap the output in Html.Encode
Make sure that you are not double encoding
I'm using the Gravatar helper class from Microsoft.Web.Helpers like so
<%: Gravatar.GetHtml("me#domain.com", 80, "identicon") %>
which produces in the source
<img src="http://www.gravatar.com/avatar/0ff2e377be7d73b15f0b48022a755717?s=80&d=identicon" alt="gravatar" />
The image URL does work but shouldn't it be &d=identicon and not &d=identicon? It appears to have encoded the ampersand. This is also the same when using Gravatar.GetUrl()
How can I stop it encoding the ampersand without rewriting my own version?
<%:Gravatar.GetHtml("me#domain.com", 80, "identicon") %>
Your telling it to encode the output, ":" is short hand for this. If you do not want to encode the output, do this
<%=Gravatar.GetHtml("me#domain.com", 80, "identicon") %>
As far as I am aware ":" is shorthand for outputting via Html.Encode()
=========Edit
What the Helper is doing is correct, it should be encoding the ampersand, more info at the link below
XHTML and & (Ampersand) encoding
In code (say in the controller action... and not in the *.aspx or *.cshtml markup), when I do this:
var avatarUrl = Gravatar.GetUrl("someone#somewhere.com", defaultImage: "identicon");
This will return the following string:
http://www.gravatar.com/avatar/923d10bc97028030e8e67e7db62658d1?s=80&d=identicon
Note the encoded ampersand (&) where there shouldn't be any encoding. I think this is not working as intended. The reason it matters, is because instead of getting the identicon (or gravatar) that we want, we get the default gravatar logo, which we dont want (the whole point of the identicon fallback). Remember, this was done from the controller, vice the view markup.
We have translated one of our pages to french and all the html within the page displays flawlessly. That said, there is a javascript table (ext js) and the accented characters are not displaying correctly. The page is encoded UTF-8 in the HTML meta tags, but when I look inside FireBug, I see the following:
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
I'm guessing the problem is related to the ISO-8859-1 having worked its way back in. Does anyone know why the page itself would display fine, but the text inside the javascript component wouldn't? Do you somehow specify the encoding separately for the javascript files?
The Accept-Charset tag gives a set of encodings that are accepted -- if all the data sent is encoded UTF-8, then don't worry about it.
Can you elaborate on exactly what is happening?
You say "javascript table" -- I presume you are constructing an HTML table in JS and placing it in the DOM? Please elaborate, especially w.r.t. any character conversions. Are you building HTML text or building with DOM elements with attributes?
Where does the JS get its data? If with AJAX, have you verified the Encoding for that page?
Does the JS use encode() or decode()? Those don't handle UTF-8 correctly.
EDIT:
Type the URL to the JS code in your browser, and look at "Page Info" to see its encoding. I'll bet it is ISO-8859-1, which would explain the header problems.
Next, check the encoding of the AJAX data. If it's dynamically created you can:
Enable "Show XMLHttpRequests" in FireBug's console,
Load on your base HTML page,
Open the FireBug console tab,
Expand the AJAX GET/POST request and open the Response sub-tab,
Check the Encoding for the data, and fix as needed.
BTW, I'm having similar problems and haven't entirely ironed out the issues (still not sure the source data isn't badly encoded).
It's possible that the ext. JS file strips out unrecognised characters as a security precaution.
The "Accept-Charset" header can be specified in a number of places, including as an attribute in certain HTML elements. Have you performed a search for Accept-Charset (case insensitive) in the offending file?