做项目的时候，有时候会需要查看一下apache的错误日志，然后就需要很繁琐的打开那个目录下面，看信息，只有当错误的时候我才会去打开那个文件。
但是最近我发现在开发的时候，自己忽略掉了很多错误，虽然不会导致出错，但是搞不好哪天就会爆发。
我不高兴每次打开那个文件，然后自己又要手动的刷新，太麻烦，所以就自己做了个网页版的，能够时时查看错误日志。
这个小工具比较简陋，就是简单的将文件内容打印到页面中，并在有新错误的时候做个title的闪动小提示。
当有新消息的时候标签就变成
用到了三个文件，jquery就不解释了，一个脚本类库。两个php文件的编码格式我改成了ansi格式，因为一开始调试的时候，从error.txt读取出来的中文会乱码。
这个文件就是用来读取error.txt的信息的
$path = 'C:\Program Files (x86)\Apache Software Foundation\Apache2.2\logs\error.log';//自定义的路径$str = file_get_contents($path);$str = str_replace("\r\n",'<p style="padding:3px 0;margin:0"></p>', $str);$str = str_replace('<script>', '<script>', $str);$str = str_replace('</script>', '</script>', $str);echo ($str);1、只要将path改成自己的绝对路径就可以了，还有就是将换行改成了一个p标签样式，这里也可以自定义
2、做了点粗糙的<script>过滤，如果不这么过滤，返回到index.php页面将会执行脚本代码
这个文件就是在展示错误信息的页面
<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="gbk"/> <title>apache 错误日志</title> <script type="text/javascript" src="jquery.js"></script></head><body> <div id="error"></div> <div id="error_bak" style="display:none"></div> <div id="error_data" style="display:none"></div> <script type="text/javascript"> //脚本逻辑 </script></body></html>
1、页面的格式是gbk
2、有两三个div用来保存读取到的错误信息，
3、error是用来展示的，新航道托福后面会做些标签添加
4、error_bak是用来备份ajax获取出来的原始信息
5、error_data是将ajax返回的数据与error_bak备份的数据做对比，判断日志是否有改变
6、脚本逻辑如下所示
<script type="text/javascript">
var move;//定时函数的ID
var titleName = document.title;//初始化时的页面标题
var first = true;//是否是第一次读取错误日志
/**
* @method private
* @name _setTitle
* @description 定时显示新错误信息提示 */
function _setTitle() { var title = document.title; if(title == titleName){
document.title = "【有新错误】";
}else{
document.title = titleName;
}
move = setTimeout('_setTitle()',1000);
} /**
* @method private
* @name _filter
* @description 将html标签过滤掉
* @param str [string] "待过滤的字符串" */
function _filter(str) { return str.replace(/<[^>]+>/g,"");
} /**
* @method private
* @name _get
* @description 异步获取错误日志 */
function _get() { var old_bak = $('#error_bak').html();// 由于要将新错误标红，这里就要做一个错误的备份， 下面的判断都用备份的来做 $.get('content.php', {}, function(data) {
$('#error_data').html(data); var current = $('#error_data').html();//添加到html代码中，再读取代码做比较，因为添加到html后会做转义，与ajax返回的数据就会有出入
if(_filter(current) != _filter(old_bak)) {//与备份的做比较 $('#error').html(data);
$('#error_bak').html(data); if(!first) { var red = data.replace(old_bak, '');
$('#error').html(old_bak + '<div style="color:red">'+red+'</div>');//将新错误标红 _setTitle();
}
} // console.log(_filter(data));
// console.log(_filter(old_bak)); first = false;
});
}
$(document).ready(function() { //初始化读取错误日志 _get(); //定时获取错误日志 setInterval(function() {
_get();
}, 4000); //在页面上随便点击一下，取消标题定时显示 $(document).click(function() {
document.title = titleName;
clearTimeout(move);
});
});</script>
1、用jquery的get来读取错误日志
2、有新错误日志的时候，做个小提示
3、有新的日志，才会将页面内容刷新一下
4、给新的几行错误日志加个颜色区分
5、绑定一个事件取消新错误提示
2014-09-22错误修正：
1、从content.php中获取到的data信息在做replace的时候，并没有替换成功，在把返回的数据添加到html中的时候，html会做一些编码，导致替换不成功。
function _get() { //..
$.get('content.php', {}, function(data) { //...
if(_filter(current) != _filter(old_bak)) {//与备份的做比较
//...
if(!first) { var red = $('#error').html().replace(old_bak, ''); //... }
} //.. });
}
刚写的一个比较粗糙的版本，还有很多问题，大家可以根据自己的情况再做修改。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
