游戏发芽网在线聊天 - XSS攻击 与 javascript标题栏闪烁
游戏发芽网的聊天功能用的人相对较少，但是我至少看到了10次以上有价值的讨论
当时怕聊天窗口太复杂，实现都用的很简单的方法，但是最近发现了两个问题。
第一个是：最近发现有位同学在玩华容道峰回路转搞不定的情况下，伪造了系统消息：
>> 搞定 峰回路转 用了1步
呵呵这个本身并没有什么，开个玩笑，无伤大雅
而且聊天记录刷新很快，一个小时以后这条记录就会消失
但是，这解释了一个很严重的问题，那就是著名的XSS攻击
具体的说，在用ajax的方式收到消息以后，我用直接追加html的方式进行添加，没有进行escape。
严重的后果可能是用户密码丢失、页面混乱等等等等
关于详细的XSS攻击参见：
1. Google搜索跨站脚本攻击， 2. 也谈跨站脚本攻击与防御， 3. 詳解XSS攻擊
最常用的方法就是escapeHTML，不过这个常用的函数javascript居然没有自带，那就写一个吧：
JavaScript语言: Javascript string escapeHTML
//一个应该常用的javascript string函数，不知为何没有直接提供
String.prototype.escapeHTML = function () {
return this.replace(/&/g,'&').replace(/>/g,'>').replace(/</g,'<').replace(/"/g,'"');
};
String.prototype.escapeHTML = function () {
return this.replace(/&/g,'&').replace(/>/g,'>').replace(/</g,'<').replace(/"/g,'"');
};
第二个问题：聊天窗口不在最前的时候，来消息用户就看不见了
搜了一下，简单的解决方案就是标题栏闪烁
一开始想的方法是：当窗口blur的时候设置一个标记，focus的恢复标记，当收到消息又有标记的时候闪烁
但是没找到合适的方法
继续搜，发现StackOverfow上有一篇文章专门说这个
使用的方法独辟蹊径：不管窗口有没有在最前，来消息都闪烁标题栏
不过当鼠标在窗口中移动的时候就停止闪烁，这样如果窗口在最前，闪烁就很快消失，否则只有切换过来才停止
呵呵，真是条条大路通罗马。
不过StackOverflow上面那份代码有问题：当有多个消息的时候，即便鼠标移动也不行了，因为创建了多个inteval。
我改进了一下，贴在下面：
JavaScript语言: Javascript - 后台窗口来消息时标题栏闪烁
//from: http://stackoverflow.com/questions/37122/make-browser-window-blink-in-task-bar
/*
this won't make the taskbar button flash in changing colours, but the title will blink on and off until they move the mouse. This should work cross platform, and even if they just have it in a different tab.
*/
function clear_blink(oldTitle) {
clearInterval(g_timeout_id);
g_timeout_id = null;
document.title = oldTitle;
document.onmousemove = null;
document.onkeydown = null;
}
function blink_info(msg) {
var oldTitle = document.title;
if (typeof(g_timeout_id) != "undefined" && g_timeout_id) {
clearInterval(g_timeout_id);
}
g_timeout_id = setInterval(function() {
document.title = document.title == msg ? ' ' : msg;
}, 500);
document.onmousemove = function() { clear_blink(oldTitle); };
document.onkeydown = function() { clear_blink(oldTitle); };
}
/*
this won't make the taskbar button flash in changing colours, but the title will blink on and off until they move the mouse. This should work cross platform, and even if they just have it in a different tab.
*/
function clear_blink(oldTitle) {
clearInterval(g_timeout_id);
g_timeout_id = null;
document.title = oldTitle;
document.onmousemove = null;
document.onkeydown = null;
}
function blink_info(msg) {
var oldTitle = document.title;
if (typeof(g_timeout_id) != "undefined" && g_timeout_id) {
clearInterval(g_timeout_id);
}
g_timeout_id = setInterval(function() {
document.title = document.title == msg ? ' ' : msg;
}, 500);
document.onmousemove = function() { clear_blink(oldTitle); };
document.onkeydown = function() { clear_blink(oldTitle); };
}
PS：心里惴惴，感觉还没有搞定的样子…
PS2: StackOverfow上面有很多好文章，以后有空转几篇
