I am looking to create a variable that is a template for repatative elements of my site. I however am only using it infrequently so I do not wish to use a javascript templating engine or library.
I am using jquery... if that effects anyones approach.
This is one of my templates.
$html_template = json_encode("
var html = '<a href=\"javascript:ajax(\'#content\',\'{$conf['dir']['web_url']}profile.php?user_id='+data.id+'\');\">
<div id=\"'+data.id+'\" class=\"fb_user\">
<img alt=\"'+data.name+'\" height=\"50\" width=\"50\" />
<p>
'+data.first_name+'
<br/>
'+data.last_name+'
</p>
</div>';");
I have gotten so lost in escaping I can't work out where I have gone wrong. The plan is to use eval within the templating function to replace the variables.
Hope someone can help
Use an editor with good highlighting and you will see where to escape.
The apostrophes (') that are inside the javascript code shouldn't be escaped, use double backslash (\) instead, so the javascript will see a single backslash and therefore will escape the apostrophe.
In the anchor don't use javascript code as href, use "#" for link and add onClick="...".
I don't think "ajax" is a jQuery function, perhaps you meant "$.ajax", but it has different parameters, may be you should read its manual.
Try to implement it in pure html and js before writing it in php and you'll know where to escape (after it works in first place).
Related
I am going through all the OWASP rules for DOM Based XSS prevention and trying to get a full understanding of each rule. I'm a bit stuck on this rule:
"RULE #2 - JavaScript Escape Before Inserting Untrusted Data into HTML Attribute Subcontext within the Execution Context"
See here:
https://www.owasp.org/index.php/DOM_based_XSS_Prevention_Cheat_Sheet#RULE_.232_-_JavaScript_Escape_Before_Inserting_Untrusted_Data_into_HTML_Attribute_Subcontext_within_the_Execution_Context
The problem is that I'm not sure what method to use when "javascript escaping" on the front-end? I know it is not a very likely use case because most front-end developers would generally avoid inserting untrusted data in to an html attribute in the first place, but nonetheless I would like to fully understand what is meant with this rule by understanding exactly what the escape method should be. Is there a simple javascript escape method people typically use on the front-end? Thanks!
EDIT: Other answers I find on stackoverflow all mention html escapers. I'm specifically looking for a javascript escaper and I want to know why owasp specifically uses the term "javascript escaper" if, as some people would suggest, an html escaper is sufficient.
Perhaps the question could also be phrased as "In the context of OWASP's cheat sheet for DOM Based XSS what is the difference between html escaping and javascript escaping? Please give an example of javascript escaping.
The escaping needed depends on the context that a value is inserted in. Using the wrong escaping may allow special characters in one context, that aren't special characters in a different context, or corrupt the values.
JavaScript escaping is for values that are inserted directly into a JavaScript string literal via a server-side templating language.
So the example they have is:
x.setAttribute("value", '<%=Encoder.encodeForJS(companyName)%>');
Here, the value of companyName is inserted into a script, surrounded by single quotes making it a JavaScript string literal. The special characters here are things like quotes, new lines, and some unicode whitespace characters. These should be converted to JavaScript escape sequences. So a quote would become \x27 rather than the HTML entity '. If you were to use HTML encoding then a quote character would be displayed as ' and a newline character would cause a syntax error. JavaScript encoding can be done in Java with encodeForJavaScript, or PHP with json_encode.
It's inserted into a JavaScript value so it should be JavaScript encoded. People are used to HTML encoding attributes but this only makes sense when directly inserting into the HTML, not when using the setAttribute DOM method. The encoding needed is the same as if it were like:
var x = '<%=Encoder.encodeForJS(companyName)%>';
The attribute doesn't need to be HTML encoded because it's not in an HTML context. HTML encoding is needed when the value is inserted directly into an attribute like:
<input value='<%=Encoder.encodeForHTML(companyName)%>'>
I have a regex created by myself that I am currently running in PHP. Although when I merge it over to JavaScript, it refuses to work. I have also tried it in Python and it works perfectly fine.
Regex:
#[[](.[^]]+)[]][()](\d+)[)]
Testing in PHP, and working
Testing in JavaScript, and not working
JavaScript doesn't automatically escape your ].
This will help you get a visual idea:
PCRE:
JS:
Python:
So to fix this, you need to escape the brackets
#[[](.[^\]]+)[\]][()](\d+)[)]
// ^ ^
The best way to write this regex is to minimize the use of character classes:
#\[(.[^\]]+)\][()](\d+)\)
That's why it's good practice to escape this stuff instead of relying on quirks of the flavor.
I generated these images through regex101.
in my project i want to retrieve tags from a web page for that i used dom methods.
But tags can be created dynamically like document.write(“<a href=”http://somedomain.com”>”);
here tags are given in the format of a string so i am trying to use regular expressions.
I want a regular expression which matches all the tags and attributes provided the expression should be able to extract specific attribute also
It is very hard to understand what you are asking and it is very unclear.
First off: never use regex to parse HTML if you have an option. It looks simple right? No. You'll find a problem sooner or later.
Second: what David said.
Now here's a regex to match any HTML tag (have not tested it or anything so try it out first if you must):
\<[^>]*\>
Be warned it will match a script tag too (do not let users write any tag to your page, whitelist a few if you must, and be prepared to have trouble if you don't use a library).
Try these out at RegExr for example (but remind that it uses ActionScript regexes, may be different from Javascript ones sometimes, for example Javascript has no lookahead/lookbehind.
I'm puzzled by this notation that did spread a lot after the first templating engine using it became successful. The notation is {{bla}}
Does anyone know the practical reason for having two sets of {}? I think it reads very poorly; The deprecated JQuery one made more sense ( ${bla} )
It's because it's not an often used combination of characters.
Template parsing is all about regular expressions and then turning the text into tokens, and then compiling those tokens into another language (like HTML).
Since we don't want to catch common characters in our regular expressions, we need to use those that aren't common combos of characters.
it's the same reason PHP uses <?php ?> and ASP uses <% %>.
Like in Twig, the lexer looks for {{ }} and {% %} to find Twig commands. If I had to use { }, every time I had that anywhere in the template (not just HTML markup), I'd have to escape it. And since the point of a template language is ease of use, The language needs to make its "tokens" as distinguishable as possible.
How come Distal works without needing any escape characters like {{}}? http://code.google.com/p/distal
I'm writing a script for a signature function in a forum program and any time someone puts a quote or some other JavaScript parse-able character into it, it breaks my program.
Is there a way either to force JavaScript to recognize it as a string without parsing it as script or, failing that, a function that escapes all scripting within a string that will be dynamic?
I did a search and all I could find were endless webpages on how to escape individual characters with a slash - perhaps my search skills need work.
Are you putting the contents of the signature using a server-side language, dynamically, in a JavaScript string literal? That probably isn't the best way to go; you may want to reconsider the way you are doing it.
For example, a better way to do it could be that you could just have an element on the page for the signature (which doesn't have to be visually distinct) and then get the contents of that for use in the script during JavaScript runtime.
If you still wanted to take the route you are going, you could replace ' with \' (or " with \" if you are using double-quoted strings in your script) and replace \n with \\n, which replaces real newlines with newline escapes.