I am having problems with UTF8 characters while using SanitizeValueStrategy('sanitize'). I have to use it since the client is using the language files to edit texts and he might use tags like <b> or <i>...
I need to use only the json file for translations. The client won't touch the app code to change any text. JSON file:
{
"H1": "Typy domů",
"NAME": "Křestní"
}
The problems, thought, only occurs while using angular's interpolation:
<h1 translate>houseTypes.H1</h1>
Typy domů
I can use this method to put text inside of element's body, but this problems still occurs for attributes.
<input placeholder="'houseTypes.NAME'|translate"></h1>
Křestní
The questions is:
How can I get UTF8 characters to be written correctly, while only using the JSON static file loader in interpolations, or any other way in attributes as is placeholder.
For anyone struggeling upon finding way how to make UTF-8 character normal even in {{interpolations}}, this is the way to do it:
$translateProvider.useSanitizeValueStrategy('sanitizeParameters');
This way the sanitize will be always made even in interpolations.
You have two options:
Use the strategy sanitizeParameters which will only sanitize the dynamic parameters, but not the actual translation (template). If you have the translation under control (but not the dynamic values), this will work.
Use the strategy escape (or escapeParameters) which does not use sanitization but escaping.
For me the problem was solved when i set SanitizeValueStrategy to null
$translateProvider.useSanitizeValueStrategy(null);
Related
In a Freemarker template on a page with Angular, I have the following:
...
ng-init="somevariable = ${(model.usercontrolledstring)}"
...
I want to make sure this is hardened against XSS, so I've set up some escaping rules. However, the following value for model.usercontrolledstring causes JavaScript to execute:
abc'+constructor.constructor('alert(1)')()+'abc
The surprising thing is that when the client receives it, it arrives thusly:
ng-init="somevariable = 'abc'+constructor.constructor('alert(1)')()+'abc'"
So it looks like it's being escaped correctly, but Angular is still deciding to run it!
So I guess my questions would be:
What am I not understanding about Angular? (In particular, its decision to run after decoding html entities)
Is there a proper way of configuring a Freemarker Template to prevent this sort of XSS?
I believe you should use somevariable = '${model.usercontrolledstring?jsString}' there.
Also, if that thing goes into a <script> block, certainly you shouldn't apply HTML escaping there. It's not decoded by the browser inside <script>, so you end up with string values that literally contain '. Unless the string meant to contain HTML as opposed to plain text, that's wrong.
I'm doing a forum like web app. Users are allowed to submit rich html text to server such as p tag, div tag, etc. In order to keep the format, server will write these tags back to the users' browser directly(without html encoded). So, I must do a potential dangerous script check to avoid XSS. Any JavaScript code is supposed to be dangerous and not allowed. So, How to detect them or any other better solution?
dangerous example 1:
<script>alert('1')</script>
dangerous example 2:
<script src="..."></script>
dangerous example 3:
click me
Use an HTML Parser
Your requirements are straightforward:
You must disallow all <script> tags, but keep certain rich HTML tags.
You must be able to escape inline Javascript in links. i.e. stringify it or strip the unsafe attributes altogether.
The correct way to handle all of these is to employ a modern standards-compliant HTML parser that is able to syntactically analyse the structure of the rich HTML sent over, identifying the tags sent over and discovering the raw values in attributes. This is, in fact, how sanitisation, as one of the comments mentions, is done.
There are a number of pre-existing HTML parsers that are designed to target XSS-unsafe input. The npm library js-xss, for example, appears to be able to do exactly what you want:
Whitelisting only specific tags
Modify unsafe attributes to return a default value
You can even run this server-side as a command line utility.
Similar libraries already exist for most languages, and you should do a thorough search of your preferred language's package repository. Alternatively, you can launch a subprocess and collect your results directly from js-xss from the command line.
Avoid using regular expressions to parse HTML naively - while it is true most HTML parsers end up using regular expressions under the hood, they do so in a fairly limited fashion for strictly well-defined grammars after correctly lexing them.
Use this regex
<script([^'"]|"(\\.|[^"\\])*"|'(\\.|[^'\\])*')*?<\/script>
for detecting all types of <script> tag
but I suggest using a iframe in sandbox mode to show ALL html code, by doing that you prevent javascript code from being able to do anything bad.
http://www.w3schools.com/tags/att_iframe_sandbox.asp
I hope this helps!
I'm working on an FAQ type project using AngularJS. I have a number of questions and answers I need to import into the page and thought it would be a good idea to use a service/directive to load the content in dynamically from JSON.
The text strings are quite unwieldily (639+ characters) and the overall hesitation I have is adding HTML into the JSON object to format the text (Line breaks etc).
Is pulling HTML from JSON considered bad practice practice, and is there a better way to solve this? I'd prefer to avoid using multiple templates but it's starting to seem like a better approach.
Thanks
If you're using AngularJS and already have a build step, html2js could help you with turning HTML templates into JS, which can then be concat'd and minified.
You could try parsing the incoming JSON before sending it to the page and just adding in a <br /> everywhere you run into a \n. That way the JSON is more universally usable if you ever decide you want to port the data to another medium.
I have JS calling remote server through AJAX. The response contains something similar to this
<script>alert(document.getElementById('some_generated_id').innerHTML; ... </script>
User copies the response and uses for own purposes. Now I need to make sure that not a single browser runs the code when I do this:
var response = '<scrip.....';
document.getElementById('output_box').innerHTML = response;
Same should apply to any HTML tags. I know that .text() from jQuery will do exactly what I need:
var response = '<scrip.....';
$('#output_box').text(response);
I am looking for any solutions, including, but not limited to: escaping special characters, however displaying them correctly; adding zero-width space to tags (has to be efficient); outputting in parts. Has to be pure JS.
If you're using a server-side language there is probably a method to escape special characters.
In PHP you could use htmlspecialchars(), it will convert certain characters that have significance in HTML to HTML entities (i.e. & to &).
They will still display correctly and you'll be able to copy and paste the text, but the javascript shouldn't run.
If you need a pure javascript solution for this, someone has answered that here https://stackoverflow.com/a/4835406/15000
Question
I would like to find out all occurrence of for example "stackoverflow" in loaded DOM using javascript and replace it with "unknown company"
This text can be a value in html text, html attribute, javascript string - generally all places which could be shown to user.
More details
I cannot search source code, because parts of it are in database, resources, external providers. That is why the easiest way for me is to validate client side.
I have a SPA and 99% is downloaded by AJAX
I am using backbone mixed with standard ASP.NET MVC (but I think it does not change anything)
I cannot provide any code because I do not have an idea how to start
My ideas
Create global handler on ajax success. Search and replace in responseText filtered by content-type: html, text, json, javascript
Read whole DOM into string and make search and replace, but I don't know if it is possible for all above resources.
I hope my question is clear enough, if not I will add more details.
$('.myelement').html(function(index, oldHtml) {
return oldHtml.replace(/stackoverflow/i, 'unknown company');
});
Something like that should replace the text on-the-fly for any given element (and children).
It's up to you to see if it's safe to assume that 'stackoverflow' doesn't appear in any HTML attributes, because they might get replaced too.