Web开发中特殊字符编码的那些事

Web开发中特殊字符编码的那些事

在Web开发中,常常会遇到因为特殊字符编码的问题,引发的安全问题,或是数据正确性的问题。特总结一下:

[b]HTML编码[/b]

HTML 中 &、"、<、>等字符有特殊含义,它们是 HTML 语言的保留字,因此不能直接使用。使用这些个字符时,应使用它们的转义序列:
&:& 
" :"
' : '
< :<
> :>

由于 HTML 网页本身就是一个文本型结构化文档,如果直接将这些包含了 HTML 特殊字符的内容输出到网页中,极有可能破坏整个 HTML 文档的结构。所以,一般情况下需要对动态数据进行转义处理,使用转义序列表示 HTML 特殊字符。下面的 JSP 网页将一些变量动态输出到 HTML 网页中:

<%@ page language="java" contentType="text/html; charset=utf-8"%> 
<%!
String userName = "</td><tr></table>";
String address = " " type="button";
%>
<table border="1">
<tr>
<td>姓名:</td><td><%=userName%></td> ①
</tr>
<tr>
<td>年龄:</td><td>28</td>
</tr>
</table>
<input value="<%=address%>" type="text" /> ②

在 ① 和 ② 处,我们未经任何转义处理就直接将变量输出到 HTML 网页中,由于这些变量可能包含一些特殊的 HTML 的字符,它们将可能破坏整个 HTML 文档的结构。我们可以从以上 JSP 页面的一个具体输出中了解这一问题:

<table border="1"> 
<tr>
<td>姓名:</td><td></td><tr></table></td>
① 破坏了 <table> 的结构
</tr>
<tr>
<td>年龄:</td><td>28</td>
</tr>
</table>
<input value=" " type="button" type="text" />
② 将本来是输入框组件偷梁换柱为按钮组件

融合动态数据后的 HTML 网页已经面目全非,首先 ① 处的 <table> 结构被包含 HTML 特殊字符的 userName 变量截断了,造成其后的 <table> 代码变成无效的内容;其次,② 处 <input> 被动态数据改换为按钮类型的组件(type="button")。为了避免这一问题,我们需要事先对可能破坏 HTML 文档结构的动态数据进行转义处理。


由于 HTML 网页本身就是一个文本型结构化文档,如果直接将这些包含了 HTML 特殊字符的内容输出到网页中,极有可能破坏整个 HTML 文档的结构。所以,一般情况下需要对动态数据进行转义处理,使用转义序列表示 HTML 特殊字符。

[b]JavaScript涉及的特殊编码[/b]

单、双引号、控制字符(制表符(tab), 反斜线(backslash), 换行(cr), 换页符(ff), etc.)

SQL特殊字符的注入
保证不要将SQL中的参数通过拼字符串的方式,就可以避免SQL注入的相关问题

常用方法:
Java端编码方法:
org.apache.commons.lang3.StringEscapeUtils
escapeEcmaScript
escapeHtml4

JavaScript端解码方法:
var decodeEntities = (function() {
// this prevents any overhead from creating the object each time
var element = document.createElement('div');

function decodeHTMLEntities (str) {
if(str && typeof str === 'string') {
// strip script/html tags
str = str.replace(/<script[^>]*>([\S\s]*?)<\/script>/gmi, '');
str = str.replace(/<\/?\w(?:[^"'>]|"[^"]*"|'[^']*')*>/gmi, '');
element.innerHTML = str;
str = element.textContent;
element.textContent = '';
}

return str;
}

return decodeHTMLEntities;
})();
var s = decodeEntities("<script>&&apos;");


Underscore.js的unescape方法

最简单的JS方法
function htmlDecode(str) {
var s = "";
if (str.length == 0) return "";
s = str.replace(/&/g, "&");
s = s.replace(/</g, "<");
s = s.replace(/>/g, ">");
s = s.replace(/'/g, "\'");
s = s.replace(/"/g, "\"");
return s;
}


[b]URL编码[/b]

当一个字符串需要作为跳转的URL地址或是URL中包含的参数时,如果包含以下特殊字符,就需要做URL编码:
Dollar ("$")
Ampersand ("&")
Plus ("+")
Comma (",")
Forward slash/Virgule ("/")
Colon (":")
Semi-colon (";")
Equals ("=")
Question mark ("?")
'At' symbol ("@")
Space
Quotation marks
'Less Than' symbol ("<")
'Greater Than' symbol (">")
'Pound' character ("#")
Percent character ("%")
Left Curly Brace ("{")
Right Curly Brace ("}")
Vertical Bar/Pipe ("|")
Backslash ("\")
Caret ("^")
Tilde ("~")
Left Square Bracket ("[")
Right Square Bracket ("]")
Grave Accent ("`")

具体情况如下:
字符串是作为URL跳转的用encodeURI
字符串是作为URL的一个参数时,使用encodeURIComponent

到了Java后台时,就需要对解析的参数调用:
URLDecoder.decode(param,"utf-8");
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值