【javascript】 初见浏览器端日志系统 log4js、bunyan

news2024/11/19 13:33:59

▒ 目录 ▒

    • 🛫 导读
      • 需求
      • 开发环境
    • 1️⃣ log4js
      • 配置实现
    • 2️⃣ bunyan
      • 自定义MyRawStream实现
    • 🛬 文章小结
    • 📖 参考资料

🛫 导读

需求

用习惯了python、java的日志系统,现在使用console.log等览器端js接口打印日志,忽然觉得不香了,至少给打印个时间,能定位到问题出现的时间。
类似的库很多,比如Winston、Pino等,不过今天的主角是log4jsbunyan,因为这两个做出来后,其他的没再尝试了,忙~~。
网上疯狂搜索了一遍,一直没找到合适的文章,先总结下这几天折腾的结果。

开发环境

版本号描述
文章日期2022-11-26
node -vv16.17.0npm -v (8.15.0)
VSCode1.70.0

1️⃣ log4js

更新很频繁的一个库,使用也比较简单,默认定义了不同级别的日志颜色,先看个效果图:
在这里插入图片描述

配置实现

log4js直接设置配置就能在浏览器中显示了,如下代码所示

const log4js = require('log4js')
log4js.configure({
  appenders: { console: { type: 'console' } },
  categories: { default: { appenders: ['console'], level: 'debug' } }
})

// 导出一个创建log的方法
export let getLogger = log4js.getLogger

调用方式

import { getLogger } from './shared/utility/log'
let log = getLogger('AppHost')

log.debug('initialize')
log.warn('ACTION_INITIALIZE_APP')
log.debug('ACTION_INITIALIZE_APP')

2️⃣ bunyan

功能强大,用户计数大,颜色不能自定义,也先看个效果图:
在这里插入图片描述

自定义MyRawStream实现

log4js直接设置配置就能在浏览器中显示了,如下代码所示

const bunyan = require('bunyan')
// const log = bunyan.createLogger({name: 'AppHost', level: 'debug'})

// 自定义实现
function MyRawStream () {}
MyRawStream.prototype.write = function (rec) {
  console.log('[%s] [%s] [%s\t] %s',
    rec.time.toISOString(),
    bunyan.nameFromLevel[rec.level],
    rec.name,
    rec.msg
  )
}

// 导出一个创建log的方法
export let getLogger = function (name) {
  return bunyan.createLogger({
    name: name,
    streams: [
      {
        level: 'debug',
        stream: new MyRawStream(),
        type: 'raw'
      }
    ]
  })
}

调用方式(代码根log4js的一样的!!!

import { getLogger } from './shared/utility/log'
let log = getLogger('AppHost')

log.debug('initialize')
log.warn('ACTION_INITIALIZE_APP')
log.debug('ACTION_INITIALIZE_APP')

🛬 文章小结

log4js、bunyan都是功能齐全的库,目前只使用了其中的浏览器日志,两者比较如下(如有错误,跪求留言指出):

log4jsbunyan
浏览器日志通过配置即可实现自定义MyRawStream实现
文件日志
http
Redisx
RabbitMQx
工具查看日志不支持bunyan CLI tool

bunyan CLI tool效果
在这里插入图片描述

📖 参考资料

  • bunyan https://github.com/trentm/node-bunyan
  • log4js https://www.npmjs.com/package/log4js
  • Comparing 5 Node.js Logging Libraries for You To Make the Optimal Choice https://betterprogramming.pub/node-js-logging-libraries-5789c379640b

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/69816.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

m基于FPGA的多级抽取滤波器组verilog设计,包括CIC滤波,HB半带滤波以及DA分布式FIR滤波

目录 1.算法描述 2.仿真效果预览 3.verilog核心程序 4.完整FPGA 1.算法描述 数字下变频中的低通滤波器是由多级抽取滤波器组实现的。信号的同相分量和正交分量再分别经由积分梳状滤波器(CIC)、半带滤波器(HB)和有限长单位脉冲响应(FIR)滤波器构成的多级抽取滤波器组进行滤波…

vcenter开机报错activating swap-devices in /etc/fstab

问题:昨天IDC机房一台存储断电了,恰巧vcenter在这台存储上,重启存储后再重启vcenter报了以下错误: 参考文档: https://www.virtualizestuff.com/2015/10/29/vcsa_fstab_failed/ https://kb.vmware.com/s/article/2069…

政企数智办公潮水里的融云「答卷」

在这张集合了党政机关、金融保险、交通、能源电力等中大型组织复杂办公需求的高难度答卷上,融云在扎实耐打的通信底层之上,保持灵活的身段和强大的进化能力,稳定而轻盈,在不断变化的环境中正在成为确定性本身。 作者|皮爷 出品…

手把手教你打造一款个人专属Android桌面

实现方式两种 1.从头到尾写一个apk然后把系统的属性加上去,然后启动的时候默认就指定到这个apk的包名,他就启动, 2.我们基于Androidlauncher3的源码去做一个定制化的修改 分析一下这两种的区别, 自定义,要有丰富的…

使用SuperMap iDesktopX如何去掉“耗子尾巴”

在项目中,通过会遇到一些错误的矢量数据,比如“耗子尾巴”。什么是“耗子尾巴呢”,我们所说的“耗子尾巴图斑”,是不规则图斑的一种形态。规则的图斑,应该形态接近圆、矩形、菱形或凸多边形的图斑。自然界中多数图斑应…

[附源码]计算机毕业设计JAVA政府项目管理平台

[附源码]计算机毕业设计JAVA政府项目管理平台 项目运行 环境配置: Jdk1.8 Tomcat7.0 Mysql HBuilderX(Webstorm也行) Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)。 项目技术: SSM mybati…

ASEMI整流桥MB10F、MB6S、ABS10参数对比

编辑-Z 封装和参数是工程师在选型整流桥时的两大重要依据,下面我们就把比较常见的ASEMI整流桥MB10F、MB6S、ABS10参数做个对比,方便大家选型。 整流桥MB10F参数: 型号:MB10F 封装:MBF-4 最大重复峰值反向电压&…

Redis - Linux下载与安装

1.通过apt方式安装Redis 在终端中输入,如下命令进行安装: # 更新软件源 sudo apt update # 安装redis-server sudo apt install redis-serverredis服务安装完成后,服务将自动启动。通过如下命令查看服务进程是否启动: ps aux |…

快速上手Django(八) -Django之 统一异常、Response处理

文章目录快速上手Django(八) -Django之 统一异常、Response处理一、统一Response处理二、统一异常处理1. 需求背景2. Django、drf统一异常处理3. Django、drf异常处理基础4. 纯django场景下5. 【重要】使用drf场景下,实现思路编写自定义异常处理方法在settings/dev.…

高端前端彻底搞定this指向(详解)

这篇文章只告诉你三件事情,this,this,还TM的是this。 1,this在javascript中是可有可无的 大家在学习javascript的时候,肯定或多或少看到过了很多代码。其中肯定会发现this的身影。我们知道他是代表的指向,可是让人迷惑的是this的…

Scheduled定时任务异步执行

1.使用配置 我在使用SpringBoot配置定时任务的过程中,使用Scheduled配置了多个定时任务,但是在项目启动的时候每次只会启动一个定时任务,只好搜索一波,直到看到了 ThreadPoolTaskScheduler的源码,才发现默认开启的线程数是 1 Configuration public class ScheduledPoolConfi…

如何用代码实现决策树来决策要不要相亲?

前言 上一篇我们了解了什么是决策树,知道了决策树构建的过程,同时聊了构建决策树的两种算法,那么我们今天来看下如何使用代码实现决策树的构建。 数据分析整体流程 数据分析一般是以下的分析流程 1、加载数据集 首先我们构建数据,提供训…

windows10配置openvino

一、前言 gpu的常用部署我们是选择trt,那么cpu的部署呢?当然是英特尔的ov 这里要注意:我们一般是现在一台机器上利用exe(后续会说)安装完ov,那么以后在配好第一台软件配置后,以后部署到其他机器上只需要直接把dll和lib直接复制到另一台就可以运行了! 也就是说,只有…

Matplotlib学习笔记(第二章 2.11使用指南 一些简单的例子)

第二章 学习指南 本页包含更多使用Matplotlib的深入指南。它分为初级、中级和高级部分,以及涵盖特定主题的部分。 有关较短的示例,请参阅我们的示例页面。您还可以在我们的用户指南中找到外部资源和FAQ。 2.1介绍 这些教程涵盖了使用Matplotlib创建可…

P4设计实现链路监控

实验要求 在本次实验中,目的是编写一个P4程序,使主机能够监控网络中所有链路的使用情况本练习基于基本的IPv4转发练习,因此请确保在尝试此练习之前完成此练习(basic.p4)具体来说,我们将修改基本P4程序以处…

使用ChatGPT完成分类、检测、分割等计算机视觉任务(Pytorch)

前言 ChatGPT是一个由OpenAI训练的大型语言模型,其知识涵盖了很多领域。 虽然ChatGPT表示它不能用于写代码,但是万一是它太谦虚了呢? 下面的文字均为ChatGPT给出的回答。 使用ChatGPT解决图像分类任务 我们需要一个PyTorch模型&#xff0…

11-18-kafka-生产者理论

11-kafka-理论: Kafka 工作流程及文件存储机制 Kafka 工作流程 Kafka 中消息是以 topic 进行分类的,生产者生产消息,消费者消费消息,都是面向 topic的。 topic 是逻辑上的概念,而 partition 是物理上的概念&#xf…

【MySQL】MySQL数据库结构与操作

✨个人主页:bit me ✨当前专栏:MySQL数据库 ✨每日一语:自从厌倦于追寻,我已学会一觅即中,自从一股逆风袭来,我已能抗御八面来风,驾舟而行。 目 录 🌴一. 数据库介绍🌿1.…

工业物联网解决方案:地下水实时监测系统

地下水是水资源的重要组成部分,它具备水量稳定、水质好等特点,是农业灌溉、工矿和城市的重要水源之一,但同时也会出现沼泽化、地面沉降、滑坡等问题,影响当地自然环境和生活用水。 随着物联网通信技术的发展以及国家水资源管理的…

JavaScript (WebAPI)

目录 一、DOM 1. DOM树结构: 2. 重要概念 3. DOM 的工作流程 二、获取/操作元素 1. 获取 ① 获取单个元素 ② 获取所有元素 2. 操作 1. 获取/修改元素内容 3. 案例 三、新增元素 1. 创建元素节点 2. 插入节点到 DOM树 四、删除元素 一、DOM DOM 全…