log4web.js-- 基于浏览器端的 console 的日志记录组件
uc4284
8年前
<h2>log4web</h2> <h2>简介</h2> <p>基于浏览器端的console的日志记录组件。支持如下特性:</p> <ol> <li>日志级别设置;</li> <li>异常提交到服务器;</li> <li>提交环境信息;</li> <li>日志Tag过滤器;</li> </ol> <h3>如何使用</h3> <p>浏览器下的引用</p> <pre> <code class="language-javascript"><script src="log4web.js"></script> <script> log4web.log("houyhea"); log4web.error(new Error("houyhea")); </script></code></pre> <p>requirejs下的引用</p> <pre> <code class="language-javascript">require.config({ paths: { "log4web": "path/to/log4web", } }); define(["log4web"], function (log4web) { log4ewb.log("houyhea"); log4web.error(new Error("houyhea")); });</code></pre> <h2>API说明</h2> <h3>config(config)</h3> <p>对日志组件进行配置。如果不传参数,则返回当前日志组件的配置信息。 配置项主要有:</p> <p>debug</p> <p>是否开启调试模式。如果开启调试模式,则可以在console中输入window.log4web进行调试.默认值:0.</p> <p>level</p> <p>日志级别,error(4)、warn(3)、info(2)、log(1)、debug(0),级别越高,输出的日志越少。比如:当前级别如果是warn,则只输出error、warn的日志.默认值:debug; 代码示例</p> <pre> <code class="language-javascript">var Level = { "error": 4, "warn": 3, "info": 2, "log": 1, "debug": 0 };</code></pre> <p>tagFilter</p> <p>日志tag筛选,正则表达式字符串.使用者可以通过在console控制台通过 <strong>log4web.config({tagFilter:"usersmodule"})</strong> 配置值输出"usersmodule"tag的日志。默认值:"".</p> <pre> <code class="language-javascript">log4web.config({tagFilter:"usersmodule"});</code></pre> <p>post</p> <p>当发生异常是是否post到服务器。 此处只有当msg参数是Error对象时,才判断是否有提交到服务器 .默认值:0.</p> <p>postContextInfo</p> <p>是否提交环境数据.默认值:1</p> <p>postUrl</p> <p>异常信息提交的服务器地址.默认值:"/api/exception"。 代码示例:</p> <pre> <code class="language-javascript">log4web.config({ debug: 0, level: "debug", tagFilter: "", post: 0, postContextInfo: 1, postUrl: "/api/exception" });</code></pre> <p>这里单独说一下postData,主要包含如下信息:</p> <ol> <li>browser.浏览器描述信息。返回字符串,格式:" Chrome,39.0.2171.95",逗号前表示浏览器类型,逗号后表示浏览器版号.</li> <li>os.操作系统字符串。</li> <li>flash.返回字符串,格式:"1,15",逗号分隔,第一个表示是否安装flash,1:是,0:否。15:表示flash版本.</li> <li>referrer.document.referrer信息.</li> <li>url.当前页面的url.</li> <li>resolution.屏幕分辨率信息.返回格式:"1920*1080",(window.screen对象获取).</li> <li>name.异常名称。</li> <li>message.异常message。</li> <li>stack.异常调用堆栈字符串。</li> </ol> <h3>log(msg,tag)</h3> <p>msg</p> <p>日志消息。可以是字符串或Error对象。</p> <p>tag</p> <p>用于过滤器,可为空。 调用示例:</p> <pre> <code class="language-javascript">log4web.log("log info.","usersmodule"); log4web.log("log info.");</code></pre> <h3>info(msg,tag)</h3> <p>msg</p> <p>日志消息。可以是字符串或Error对象。</p> <p>tag</p> <p>用于过滤器,可为空。</p> <h3>debug(msg,tag)</h3> <p>msg</p> <p>日志消息。可以是字符串或Error对象。</p> <p>tag</p> <p>用于过滤器,可为空。</p> <h3>warn(msg,tag)</h3> <p>msg</p> <p>日志消息。可以是字符串或Error对象。</p> <p>tag</p> <p>用于过滤器,可为空。</p> <h3>error(msg,tag)</h3> <p>msg</p> <p>日志消息。可以是字符串或Error对象。</p> <p>tag</p> <p>用于过滤器,可为空。</p> <h2>测试用例</h2> <p><a href="/misc/goto?guid=4959622429821155963" rel="nofollow,noindex">参见</a> 。</p> <h2>浏览器兼容性</h2> <p>兼容IE8+,chrome,firefox。</p> <h2>依赖</h2> <p>需要依赖 <strong>jquery</strong> 库,post数据用到了jquery.post方法。如果不想依赖jquery,可自行修改相关代码。</p> <h2> </h2> <p> </p> <p> </p>