chrome console监控客服回复

背景

二半夜在某服务器网站提交了一个ticket，时间紧迫，我需要第一时间看到对方回复，但我又不想坐在电脑前面干等，如何破？
是不是可以写一个js脚本监控页面内容变动，然后通过某种方式叫醒我？

实现

1. chrome console里实现自动刷新页面
   参考链接1里的方法可以做到了。

timeout=prompt("Set timeout (Second):");
count=0
current=location.href; // 获取当前的URL
if(timeout>0)
    setTimeout('reload()',1000*timeout);
else
    location.replace(current);  // 时间间隔不大于0，仅刷新一次  

function reload(){
    setTimeout('reload()',1000*timeout); // timeout秒后执行reload函数，实现无限循环刷新  
    count++;
    console.log('每（'+timeout+'）秒自动刷新,刷新次数：'+count);
    fr4me='<frameset cols=\'*\'>\n<frame src=\''+current+'\'/>';
    fr4me+='</frameset>';
    with(document)
    {
        write(fr4me);
        void(close())
    };
}

这段代码很简单啊，首先要求用户输入一个刷新价格时间。然后调用reload, reload()里面设定计时器，通过iframe实现页面刷新。

2. 刷新页面之后统计table里面tr的数量，当前是2，那么大于2的时候，就可以认为有新内容回复了
   如何用document对象获得iframe里面的节点。经过实验，可以如此实现

// 通过document获得iframe对象
iframe = document.getElementById('testFrame');
if(iframe != null){
    // 通过 iframe.contentWindow.document获得iframe中的ducument对象
    quantity = iframe.contentWindow.document.getElementsByTagName("tr").length;
}else{
    quantity = -1;
}
console.log(quantity);

3. 如何叫醒我?
   看了下youku视频是可以自动播放的，那么打开youku视频连接就可以了

window.open('https://v.youku.com/v_show/id_XNDM5ODQ3MTgxNg==.html?spm=a2ha1.12675304.m_7182_c_14738.d_2&s=afec14100549491aab4d&scm=20140719.rcmd.7182.show_afec14100549491aab4d','','height=500,width=611,scrollbars=yes,status =yes');

实现

我就不重构这段代码了，想更整洁自己封函数就好了

timeout=prompt("Set timeout (Second):");
count=0
current=location.href; // 获取当前的URL
if(timeout>0){
    setTimeout('reload()',1000*timeout);
} else {
    location.replace(current);  // 时间间隔不大于0，仅刷新一次
}

function reload(){
    if(count <= 2){
        setTimeout('reload()',1000*timeout); // timeout秒后执行reload函数，实现无限循环刷新
    }
    count++;
    console.log('每（'+timeout+'）秒自动刷新,刷新次数：'+count);

    iframe = document.getElementById('testFrame');
    if(iframe != null){
        quantity = iframe.contentWindow.document.getElementsByTagName("tr").length;
    }else{
        quantity = -1;
    }
    console.log(quantity);

    with(document)
    {
        document.getElementsByTagName("body")[0].innerHTML = "<iframe id=\"testFrame\" src=\""+window.location.toString()+"\" style=\"position: absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%;\" ><\/iframe>";

        if(quantity > 2){
            window.open('https://v.youku.com/v_show/id_XNDM5ODQ3MTgxNg==.html?spm=a2ha1.12675304.m_7182_c_14738.d_2&s=afec14100549491aab4d&scm=20140719.rcmd.7182.show_afec14100549491aab4d','','height=500,width=611,scrollbars=yes,status =yes');
        }
        void(close())
    };
}

效果

参考链接

1. https://blog.csdn.net/mp159/article/details/90765180
2. https://stackoverflow.com/questions/3275816/debugging-iframes-with-chrome-developer-tools