log4s 方便的前端日志下载工具

JasonZhang 发布于2019-08-23 14:10 / 2230人阅读

摘要：是对的重构，并且让其支持下载。所以我做了这个工具，可以点击某个按钮，就能把前端日志下载下来，然后将日志附在详情中。更加方便的排查问题。

log4s

https://github.com/wangduandu...

log4s是对log4b的重构，并且让其支持npm下载。

做这个工具是因为：

某些时候看服务端日志太麻烦

提Bug时，给的相关信息又无法分析出问题原因

有些错误是无法说明清楚的，比如websocket接收到的某个消息的某个字段错误。

所以我做了这个工具，可以点击某个按钮，就能把前端日志下载下来，然后将日志附在Bug详情中。更加方便的排查问题。

特点

支持>= ie10

支持日志下载

安装

yarn add log4s

使用

import Log4s from "log4s" 
// 或者 const Log4s from "log4s"
// 或者 直接script https://cdn.jsdelivr.net/npm/log4s@1.0.1/dist/log4s.umd.js 引入到html中

let log = new Log4s()

log4s.log("你好")
log4s.log("你好 abc")
log4s.log("你好, def")
log4s.log("你好, ahha")
log4s.log("你好,a")
log4s.search("a")

日志下载后，内容如下：

12-19 21:23:43.882 你好
12-19 21:23:43.882 你好 abc
12-19 21:23:43.882 你好, def
12-19 21:23:43.882 你好, ahha
12-19 21:23:43.882 你好,a

Log4s(options) 配置

默认配置：

export default {
  maxLines: 2500,  // 最多纪录多少行日志
  lineMaxChars: 2500, // 每行日志最多允许多少个字符，超出会截取
  logFilename: "log4s.log", // 下载时文件名称
  lineBreak: "
", // 下载文件时，每行日志之间的换行符
  enableLog: true, // 是否启动日志记录功能
  needTimestamp: true // 每行日志是否需要时间戳
}

实例方法

let log = new Log4s()

log(string|object) 写日志

getAllLog() 获取所有日志

search(keyword) 按关键词搜索日志

cleanAll() 清空日志

download() 下载日志

云服务器 GPU云服务器 log4j日志 log4j记录日志 log4j日志文件 log4j输出日志

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/100199.html

前端代码的错误日志收集了解一下

摘要：前言开发应用程序过程中的一种常见的做法就是集中保存错误日志以便查找重要错误的原因就像数据库和服务器都会定期写入日志一样在复杂的应用程序中我们同样推荐你把错误也回写到服务器换句话再说我们也可以将这些错误写入到保存服务器端错误的地方只不过标明他前言开发web应用程序过程中的一种常见的做法,就是集中保存错误日志,以便查找重要错误的原因. 就像数据库和服务器都会定期写入日志一样,在复杂的...

changfeng1050 2019-08-26 11:59 评论0 收藏0
log4j2+ELK

摘要：问题初衷最近有个项目需求，需要统计下用户的使用情况，比如什么时候登录的，查询了什么内容等信息。缺点扩展能力需要靠自己设计，统计展示画面需要自己做。可轻松应对分布式，数据量大的情况。通过，如下修改，在重启后又会恢复原值。问题初衷最近有个项目需求，需要统计下用户app的使用情况，比如：什么时候登录的，查询了什么内容等信息。解决方案 1.定义用户轨迹模型，每步操作都写到数据库中，然后在...

Sunxb 2019-06-28 18:01 评论0 收藏0
iKcamp｜基于Koa2搭建Node.js实战（含视频）☞ 记录日志

沪江CCtalk视频地址：https://www.cctalk.com/v/15114923883523 showImg(https://segmentfault.com/img/remote/1460000012932474?w=1606&h=968); log 日志中间件最困难的事情就是认识自己。在一个真实的项目中，开发只是整个投入的一小部分，版本迭代和后期维护占了极其重要的部分。项目上线...

stefan 2019-08-22 13:57 评论0 收藏0
【译】log4j介绍

摘要：在中对一个实例命名非常的简单，在每一个类中可以有一个静态的实例对象，可以用类的完全限定名作为实例的名字。但不管怎样，用类的完全限定名作为实例的名字是一个非常好的方式。本文是对log4j官网Introduction部分的翻译，原文链接地址：http://logging.apache.org/log...。 Introduction：几乎每个大型应用都包含自己的日志API。1996年，...

ztyzz 2019-08-15 11:09 评论0 收藏0