在不知道log4javascript为何物时,总喜欢在javascript中用alert()来跟踪代码信息,那叫烦,总是弹出对话框。
有问题就得解决问题啊,google……,搜索到log4javascript。
读了下tutorial发现工具很好用,马上放到自己正在开发的一个项目中,准备体验一下效果。使用步骤如下(基本上是对文档的翻译):
1、下载地址:
http://sourceforge.net/projects/log4javascript
2、解压下载的文件并拷贝log4javascript.js到你需要的地方,其他文件可选
3、在web页面中初始化log4javascript。
<script type="text/javascript" src="log4javascript.js"></script>
<script type="text/javascript">
var log = log4javascript.getDefaultLogger();
</script>
默认的logger使用PopUpAppender,它会打开一个窗口。默认情况下,这个窗口会在写第一条日志时打开。如果你不想要弹出这个窗口,你可以使用如下代码,屏蔽它。
log.setEnabled(false);
4、包括你的logging语句在你的代码里
你有6种写日志的方法,这取决于你希望记录日志内容的严重性。默认情况下,所有的消息在弹出窗口中打印。logging方法如下:
log.trace(message[, message2, ... ][, exception])
log.debug(message[, message2, ... ][, exception])
log.info(message[, message2, ... ][, exception])
log.warn(message[, message2, ... ][, exception])
log.error(message[, message2, ... ][, exception])
log.fatal(message[, message2, ... ][, exception])
5、Logging示例
(1)简单的logging消息字符串
log.info("Hello World");
显示如下
19:52:03 INFO - Hello world
(2)记录错误消息串
try
{
throw new Error("Faking something going wrong!");
}
catch (e)
{
log.error("An error occurred", e);
}
显示如下
19:52:32 ERROR - An error occurred Exception: Faking something going wrong! on line number 80 in file basic.html
(3)一条log语句记录多条信息
var a = "Hello";
var b = 3;
log.debug(a, b);
显示如下
19:53:05 DEBUG - Hello 3
(4)log记录对象
var obj = new Object();
obj.name = "Octopus";
obj.tentacles = 8;
log.info(obj);
显示如下
19:53:17 INFO - {
name: Octopus,
tentacles: 8
}
6、改变默认的logger
开始的时候使用默认的logger可能感觉不错,但是如果想要做一些改变我们应该做些什么呢?(比如:任何时候只要有日志消息都会弹出窗口,或者新的日志信息不是出现在窗口顶端而是出现在底端)
在这种情况下,你将会需要建立新的日志,然后,建立新的PopUpAppender,设置选项,并且增加到logger中:
<script type="text/javascript" src="log4javascript.js"></script>
<script type="text/javascript">
// Create the logger
var log = log4javascript.getLogger();
// Create a PopUpAppender with default options
var popUpAppender = new log4javascript.PopUpAppender();
// Change the desired configuration options
popUpAppender.setFocusPopUp(true);
popUpAppender.setNewestMessageAtTop(true);
// Add the appender to the logger
log.addAppender(popUpAppender);
// Test the logger
log.debug("Hello world!");
</script>
7、发送日志信息到服务器端
对于这个问题可以使用AjaxAppender来解决,如下:
var ajaxAppender = new log4javascript.AjaxAppender(URL);
log.addAppender(ajaxAppender);
现在你的日志消息将会出现在弹出的窗口中,同时将被异步发送到你指定的URL中。
8、改变日志消息的格式
使用Layout,你可以格式化日志格式。例如:
var log = log4javascript.getLogger("mylogger");
var layout = new log4javascript.PatternLayout("[%-5p] %m");
var popUpAppender = new log4javascript.PopUpAppender(layout);
调用
log.debug("Hello world");
将会在窗口输出
[DEBUG] Hello world
分享到:
相关推荐
log4javascript演示 博文链接:https://lxy19791111.iteye.com/blog/263165
相信做过Java前端开发的小伙伴都知道,当业务复杂或者前端写的JS一多,浏览器的debug就有点力不从心了。推荐大家使用日志插件log4javascript!
log4javascript-1.4.1 日志 信息 记录框架
用在javascript上输出日志的组件。类似于log4j和log4net
log4javascript是基于Java日志框架log4jJavaScript日志框架。
log4javascript2 log4javascript 的第 2 版,一个基于 log4j 的带有 API 的 JavaScript 日志库。 这是一个正在进行的工作。 可以在找到版本 1 的最新稳定版本。 官方网站:
log4javascript 与 bower 一起使用的 log4javascript 包
HelloLog4javascript log4javascript测试
log4javascript 这是此处列出的原始代码的分支: : 虽然我喜欢 API 和 log4jjavascript 的一般概念。 我发现代码不是特别模块化,而且它的大小太大(压缩后的 JS 是 128k )。 所以我的目标是创建一个具有子模块...
Log4javascript 117 Medireview 117 Minification (programming) 118 Objective-J 120 John Resig 122 Reverse Ajax 123 Rico (Ajax) 124 Seed (programming) 126 Server-side JavaScript 129 Comparison of Server-...
可以用来在js里面输出调试信息,类似java里面的log。从此可以摆脱alert的烦恼了。包你满意!!!! 可以设置 log.level = 0,1,2,3; 例如: log.info("id=",3); 输出[INFO ]: id=3 他会打开一个新的...
面向对象的javascript 完美例子源代码 log4j.js
mylog.log("Hello my app!!"); var viewlog = Logger.get("view"); viewlog.warn("where am I?"); viewlog.error("I don't want work!!"); Logger.get("view").info("Goodbye"); // Above will pop an window, ...
Log4Jse是一个非常简洁、可定制的Javascript日志输出管理工具,类似Log4J,但是比它简单很多,可以实现自定义日志输出级别、自定义日志输出方式等功能。 示例代码: // Usage: var mylog = Logger.get("app"); mylog...
一份很详细如同log4j的js debug 资料。
log4js 钉钉机器人的 Appenders
Simple Log In Function with Javascript