过滤所见所得编辑器里的危险脚本

转载地址：http://bbs.51js.com/thread-77637-1-1.html

所见所得的编辑器现在用得越来越多，原因之一，用户体验好。但是作为开发者，我们也应该清醒的认识到，这样的编辑器往往成了危险脚本、木马的温床。我们不能容忍蛀虫就在我们自己的东西里面滋生。
下面我就来尝试用正则替换的办法，使得编辑器里面的脚本无所遁形。可能我想的不是很全面，希望有漏网之鱼的，朋友们请提出。
脚本藏身之处不过有四：
1、<script>标签、<link>标签、<style>标签、iframe标签
2、on开头的标签属性
3、javascript(vbscript)伪协议
4、css的epression
下面是他们的字符串规则：
1、<(script|link|style|iframe)(.|\n)*<\/\1>\s*
2、\s*on[a-z]+\s*=\s*("[^"]+"|'[^']+'|[^\s]+)\s*(?=>)
3、\s*(href|src)\s*=\s*("\s*(javascript|vbscript):[^"]+"|'\s*(javascript|vbscript):[^']+'|(javascript|vbscript):[^\s]+)\s*(?=>)
4、epression\((.|\n)*\);?
了解他们的规则后，抓虫行动就水到渠成。下面看具体代码：

1. <textarea id="bug" cols="80" rows="16">
   
2. <button id="kick">抓虫1</button>
   
3. <script>
   
4. function kickBug(str) {
   
5.   return str.replace(/<(script|link|style|iframe)(.|\n)*\/\1>\s*/ig,"");
   
6. }
   
7. </script>
   
8. <iframe></iframe>
   
9. <link href='test.css'></link>
   
10. <style>
    
11.   a {
    
12.     height:expression(alert('hei'));
    
13.   }
    
14. </style>
    
15. </textarea>
    
16. <button id="kick">抓虫1</button>
    
17. <script>
    
18. function kickBug(str) {
    
19.   return str.replace(/<(script|link|style|iframe)(.|\n)*\/\1>\s*/ig,"");
    
20. }
    
21. if(!/msie/i.test(navigator.userAgent)){
    
22. HTMLElement.prototype.__defineGetter__("innerText",function(){
    
23.         return this.textContent;
    
24. });
    
25. HTMLElement.prototype.__defineSetter__("innerText",function(text){
    
26.         this.textContent = text;
    
27. });
    
28. }
    
29. document.getElementById("kick").onclick = function() {
    
30.   var bug = document.getElementById("bug");
    
31.   bug.innerText = kickBug(bug.innerText);
    
32. }
    
33. </script>

复制代码运行代码另存代码

1. <textarea id="bug" cols="80" rows="5">
   
2. <a onclick="test();
   
3. test1()"  onblur=
   
4. "test3()">test</a>
   
5. </textarea>
   
6. <button id="kick">抓虫2</button>
   
7. <script>
   
8. function kickBug(str) {
   
9.   return str.replace(/<[a-z][^>]*\s*on[a-z]+\s*=[^>]+/ig,function($0,$1){
   
10.       return $0.replace(/\s*on[a-z]+\s*=\s*("[^"]+"|'[^']+'|[^\s]+)\s*/ig,"");
    
11.   });
    
12. }
    
13. if(!/msie/i.test(navigator.userAgent)){
    
14. HTMLElement.prototype.__defineGetter__("innerText",function(){
    
15.         return this.textContent;
    
16. });
    
17. HTMLElement.prototype.__defineSetter__("innerText",function(text){
    
18.         this.textContent = text;
    
19. });
    
20. }
    
21. document.getElementById("kick").onclick = function() {
    
22.   var bug = document.getElementById("bug");
    
23.   bug.innerText = kickBug(bug.innerText);
    
24. }
    
25. </script>

复制代码运行代码另存代码

1. <textarea id="bug" cols="80" rows="5">
   
2. <a onclick="test();" href="
   
3. j&#65;vascript:alert('a')" href="j&#65vascript:" 
   
4. href="vbscript:alert()"
   
5. >test</a>
   
6. </textarea>
   
7. <button id="kick">抓虫3</button>
   
8. <script>
   
9. function kickBug(str) {
   
10.   return str.replace(/<[a-z][^>]*\s*(href|src)\s*=[^>]+/ig,function($0,$1){
    
11.      $0 = $0.replace(/&#(6[5-9]|[78][0-9]|9[0789]|1[01][0-9]|12[012]);?/g,function($0,$1){return String.fromCharCode($1);});
    
12.      return $0.replace(/\s*(href|src)\s*=\s*("\s*(javascript|vbscript):[^"]+"|'\s*(javascript|vbscript):[^']+'|(javascript|vbscript):[^\s]+)/ig,"");
    
13.   });
    
14. }
    
15. if(!/msie/i.test(navigator.userAgent)){
    
16. HTMLElement.prototype.__defineGetter__("innerText",function(){
    
17.         return this.textContent;
    
18. });
    
19. HTMLElement.prototype.__defineSetter__("innerText",function(text){
    
20.         this.textContent = text;
    
21. });
    
22. }
    
23. document.getElementById("kick").onclick = function() {
    
24.   var bug = document.getElementById("bug");
    
25.   bug.innerText = kickBug(bug.innerText);
    
26. }
    
27. </script>

复制代码运行代码另存代码

1. <textarea id="bug" cols="80" rows="5">
   
2. expression()
   
3. <a style="color:expression(
   
4. 'red'
   
5. )">test</a>
   
6. </textarea>
   
7. <button id="kick">抓虫4</button>
   
8. <script>
   
9. function kickBug(str) {
   
10.     return str.replace(/<[a-z][^>]*\s*style\s*=[^>]+/ig,function($0,$1){
    
11.        $0 = $0.replace(/&#(6[5-9]|[78][0-9]|9[0789]|1[01][0-9]|12[012]);?/g,function($0,$1){return String.fromCharCode($1);});
    
12.           return $0.replace(/\s*style\s*=\s*("[^"]+(expression)[^"]+"|'[^']+\2[^']+'|[^\s]+\2[^\s]+)\s*/ig,"");
    
13.    });
    
14. }
    
15. if(!/msie/i.test(navigator.userAgent)){
    
16. HTMLElement.prototype.__defineGetter__("innerText",function(){
    
17.         return this.textContent;
    
18. });
    
19. HTMLElement.prototype.__defineSetter__("innerText",function(text){
    
20.         this.textContent = text;
    
21. });
    
22. }
    
23. document.getElementById("kick").onclick = function() {
    
24.   var bug = document.getElementById("bug");
    
25.   bug.innerText = kickBug(bug.innerText);
    
26. }
    
27. </script>

复制代码运行代码另存代码

在winter的提醒下，加多了一个过滤iframe的。
加入过滤link标签、style标签
处理了类如e的html实体