我使用JavaScript从隐藏字段中拉出一个值并在文本框中显示它。隐藏字段中的值被编码。
例如,
<input id='hiddenId' type='hidden' value='chalk & cheese' />
被卷入
<input type='text' value='chalk & cheese' />
通过一些jQuery来获取隐藏字段的值(在这一点上，我失去了编码):
$('#hiddenId').attr('value')
问题是当我读粉笔&cheese从隐藏字段，JavaScript似乎失去了编码。我不希望价值是粉笔和奶酪。我想要字面上的amp;被保留。
是否有JavaScript库或jQuery方法可以对字符串进行html编码?
当前回答
<script>
String.prototype.htmlEncode = function () {
return String(this)
.replace(/&/g, '&')
.replace(/"/g, '"')
.replace(/'/g, ''')
.replace(/</g, '<')
.replace(/>/g, '>');
}
var aString = '<script>alert("I hack your site")</script>';
console.log(aString.htmlEncode());
</script>
将输出:<script>alert("I hack your site")</script>
. htmlencode()一旦定义，就可以在所有字符串上访问。
其他回答
基于angular的sanitize…(es6模块语法)
// ref: https://github.com/angular/angular.js/blob/v1.3.14/src/ngSanitize/sanitize.js
const SURROGATE_PAIR_REGEXP = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g;
const NON_ALPHANUMERIC_REGEXP = /([^\#-~| |!])/g;
const decodeElem = document.createElement('pre');
/**
* Decodes html encoded text, so that the actual string may
* be used.
* @param value
* @returns {string} decoded text
*/
export function decode(value) {
if (!value) return '';
decodeElem.innerHTML = value.replace(/</g, '<');
return decodeElem.textContent;
}
/**
* Encodes all potentially dangerous characters, so that the
* resulting string can be safely inserted into attribute or
* element text.
* @param value
* @returns {string} encoded text
*/
export function encode(value) {
if (value === null || value === undefined) return '';
return String(value).
replace(/&/g, '&').
replace(SURROGATE_PAIR_REGEXP, value => {
var hi = value.charCodeAt(0);
var low = value.charCodeAt(1);
return '&#' + (((hi - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000) + ';';
}).
replace(NON_ALPHANUMERIC_REGEXP, value => {
return '&#' + value.charCodeAt(0) + ';';
}).
replace(/</g, '<').
replace(/>/g, '>');
}
export default {encode,decode};
jQuery的技巧不编码引号，在IE中它会删除你的空白。
基于Django中的escape templatetag，我猜它已经被大量使用/测试过了，我做了这个函数来做需要的事情。
可以说，它比解决空格剥离问题的任何变通方法都更简单(而且可能更快)——而且它对引号进行了编码，例如，如果您打算在属性值中使用结果，那么引号是必不可少的。
function htmlEscape(str) {
return str
.replace(/&/g, '&')
.replace(/"/g, '"')
.replace(/'/g, ''')
.replace(/</g, '<')
.replace(/>/g, '>');
}
// I needed the opposite function today, so adding here too:
function htmlUnescape(str){
return str
.replace(/"/g, '"')
.replace(/'/g, "'")
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/&/g, '&');
}
更新2013-06-17: 在寻找最快的转义，我发现了一个replaceAll方法的实现: http://dumpsite.com/forum/index.php?topic=4.msg29#msg29 (这里也引用了:替换字符串中所有字符实例的最快方法) 下面是一些性能结果: http://jsperf.com/htmlencoderegex/25
它给出了与上面的内置替换链相同的结果字符串。如果有人能解释为什么它更快，我会很高兴!?
更新2015-03-04: 我刚刚注意到AngularJS正在使用上面的方法: https://github.com/angular/angular.js/blob/v1.3.14/src/ngSanitize/sanitize.js#L435
他们增加了一些改进——他们似乎在处理一个模糊的Unicode问题，以及将所有非字母数字字符转换为实体。在我的印象中，后者是不需要的，只要您为您的文档指定了UTF8字符集。
我要指出的是，(4年后)Django仍然没有做这些事情，所以我不确定它们有多重要: https://github.com/django/django/blob/1.8b1/django/utils/html.py#L44
更新2016-04-06: 你也可能希望转义正斜杠/。对于正确的HTML编码，这不是必需的，但是OWASP建议将其作为一种抗xss安全措施。(感谢@JNF在评论中提出这个建议)
.replace(/\//g, '/');
Underscore提供了_.escape()和_.unescape()方法来执行此操作。
> _.unescape( "chalk & cheese" );
"chalk & cheese"
> _.escape( "chalk & cheese" );
"chalk & cheese"
没有Jquery更快。你可以对字符串中的每个字符进行编码:
function encode(e){return e.replace(/[^]/g,function(e){return"&#"+e.charCodeAt(0)+";"})}
或者只关注主要角色(&，inebreaks， <， >， "和')，比如:
函数编码(r) { 返回r.replace (/ [\ x26 \ x0A \ < > "] / g函数(r){返回" & # + r.charCodeAt(0) +”;“}) ｝ 测试。value=encode('编码HTML实体!\n\n"安全"转义<脚本id=\'\'> &有用在<pre>标签!'); testing.innerHTML = test.value; /************* * \x26是& &号(必须排在第一位)， * \x0A为换行符， *************/ <textarea id=test rows="9" cols="55"></textarea> www.WHAK.com < div id = "测试" > < / div >
我有一个类似的问题，解决它使用函数encodeURIComponent从JavaScript(文档)
例如，在你的例子中，如果你使用:
<input id='hiddenId' type='hidden' value='chalk & cheese' />
and
encodeURIComponent($('#hiddenId').attr('value'))
你会得到粉笔%20%26%20奶酪。甚至空格也要保留。
在我的情况下，我必须编码一个反斜杠，这段代码完美地工作
encodeURIComponent('name/surname')
我的名字是% 2姓氏
