Skip to content

Latest commit

 

History

History
127 lines (107 loc) · 3.14 KB

README.markdown

File metadata and controls

127 lines (107 loc) · 3.14 KB

jQuery.escapeHtml()

[A jQuery plugins to escape Html characters]
*Version 1.2 (Beta)*
Introduction :

jQuery.escapeHtml(), is a jQuery plugin to remove html tag from user input and make them XSS safe.

Advantage of using jQuery.escapeHtml:

The jQuery.escapeHtml method is design to filter all html tag from client side, so you have an extra wall to avoid XSS attacks on your site via user input.

How to Use jQuery.escapeHtml:
Example :

Just add below chunk of jQuery code on your html page.

/* Start */
(function($) {
	$.fn.escapeHtml = function() {
		var ua = navigator.userAgent;
		var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
		var e = document.createElement("div"),
		s = '';
		$(e).text($(this).val() || $(this).html() || $(this).text());				
		s = $(e).text();				
		if (re.exec(ua) != null) {
			$(e).remove();
		} else {
			e.remove();
		}
		return s.replace(/<\/?([a-z][a-z0-9]*)\b[^>]*>?/gi, '');
	};
})(jQuery);
/* End */

and use like

// if you want to real input value then, go with jQuery '.val()' option
var htmlString = $('#yourelement').val();
// if you want to remove html character then, go with jQuery '.escapeHtml()' option
var safeHtmlString = $('#yourelement').escapeHtml();

Example Page:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery escapeHtml Plugin testing Page</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
	/* Start */
	(function($) {
		$.fn.escapeHtml = function() {
			var ua = navigator.userAgent;
			var re = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
			var e = document.createElement("div"),
			s = '';
			$(e).text($(this).val() || $(this).html() || $(this).text());				
			s = $(e).text();				
			if (re.exec(ua) != null) {
				$(e).remove();
			} else {
				e.remove();
			}alert(s);
			return s.replace(/<\/?([a-z][a-z0-9]*)\b[^>]*>?/gi, '');
		};
	})(jQuery);
	/* End */

	/**
	 * using escapeHtml to clean xss data
	 * @return {[type]} [description]
	 */
	$(function () {
		$('#run-xssSafe').click(function () {
			var s = $('#xssSafe').escapeHtml();				 
			$('#output-xssSafe').html(s);
		});
	});

	/**
	 * without escapeHtml getting xss data
	 * @return {[type]} [description]
	 */
	$(function () {
		$('#run-noXssSafe').click(function () {
			var s = $('#noXssSafe').val();				 
			$('#output-noXssSafe').html(s);
		});
	});

</script>
</head>
<body>
<input type="text" name="xssSafe" id="xssSafe" value='<script>document.body.style.backgroundColor="red"; </script>' />		
<span id="output-xssSafe"></span>
<button id="run-xssSafe">Kill the XSS Data :)</button>

<br><br><br>

<input type="text" name="noXssSafe" id="noXssSafe" value='<script>document.body.style.backgroundColor="red"; </script>' />
<span id="output-noXssSafe"></span>
<button id="run-noXssSafe">XSS Killed me :(</button>


</body>
</html>
Read more about XSS:
https://www.owasp.org/index.php/XSS_Filter_Evasion_Cheat_Sheet

Cheers!! Neeraj Singh | neeraj[dot]singh[at]lbi[dot]co[dot]in

[Document End]