I was developing a a web application at work for use on the intranet. And if you’re anything like the security nut I am you love logging just as much as I do. I love logging so much I have a page for just about every I use generally my log pages look something like
import os
print "Content-Type:text/html"
print
print
print '<br/>'.join(os.popen("tail -100 somelog.log").read().split("n"))
Now this is ok but wouldn’t it be cool if it updated without the page refreshing?
Now I’m not very good at Jquery so I had no idea to start but eventually I came across Jeff Star’s blog post http://perishablepress.com/ajax-error-log/ which was pretty much exactly what I was after without all the fancy 404 logging since my web framework does all that.
So quite simply I took this code
<!DOCTYPE HTML>
<html>
<head>
<title>Ajax Error Log</title>
<!-- Ajax Error Log @ http://perishablepress.com/ajax-error-log/ -->
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style>
pre {
font: 10px/1.5 Courier, "Courier New", mono;
background-color: #efefef; border: 1px solid #ccc;
width: 700px; margin: 7px; padding: 10px;
white-space: pre-wrap;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js "></script>
<script>
$(document).ready(function() {
$("#results").load("AjaxErrorLog.php");
var refreshId = setInterval(function() {
$("#results").load("AjaxErrorLog.php").fadeIn("slow");
}, 2000); // refresh time (default = 2000 ms = 2 seconds)
});
</script>
</head>
<body>
<noscript><div id="response"><h1>JavaScript is required for this demo.</h1></div></noscript>
<div id="results"></div>
</body>
</html>
And changed AjaxErrorLog.php to the cgi script tailing my log and presto a live log feed.