flutter_socket_logger

Description:

flutter socket logger

背景 #
手机App打包安装后，开发、测试有时要查看程序的实时日志输出，来定位和排查问题。
一般选择在App内集成一个小的console界面来打印日志，但是受限于屏幕尺寸，查看和搜索日志都不太方便。
能不能把手机App的运行日志实时打印到PC屏幕上来进行分析呢？
flutter_socket_logger 可以帮你快速实现这个功能！
特性 #

支持按日志级别和输入关键字过滤日志
在同一个网络内，扫描二维码或输入loggerId可快速连接到不同PC上的日志浏览器查看日志
日志界面基于Flutter开发，可以快速部署到PC、浏览器、手机上，显示体验一致
支持ANSI Color颜色文本输出
功能无缝对接dart logger库

安装部署 #
假定部署到 {host}

启动转发服务

$ cd logger_server
$ npm run app
copied to clipboard
转发服务默认在 http://{host}:3001，配置nginx反向代理，通过 https://{host}/ 访问

部署日志浏览器

$ cd logger_browser
$ flutter build web --base-href /logger/browser/
$ cp -R build/web {webroot}
copied to clipboard
配置nginx，通过 https://{host}/logger/browser/ 访问

部署日志发送工具（用于测试）

$ cd logger_writer
$ flutter build web --base-href /logger/writer/
$ cp -R build/web {webroot}
copied to clipboard
配置nginx，通过 https://{host}/logger/writer/ 访问
快速体验 #

在PC添加并信任证书 server.crt （如使用自签名证书）
在PC浏览器上打开日志浏览器 https://{host}/logger/browser/
在PC浏览器上打开日志发送工具 https://{host}/logger/writer/
记录下日志浏览器上的loggerId，在日志发送工具中输入，点击【start】后就可以在日志浏览器上看到发送工具打印的日志




使用方法 #

在Flutter App中添加依赖package：flutter_socket_logger
创建 SocketOutput，并添加到Logger （可以通过扫码或复制的方式获取日志浏览器loggerId）
用Logger正常打日志即可在浏览器中远程查看日志输出

import 'package:flutter_socket_logger/flutter_socket_logger.dart';

SocketOutput output = SocketOutput(
url: serverUrl, //日志转发服务地址
peer: peer, //日志浏览器的loggerId
onBind: (ok) { //绑定日志浏览器回调
});

Logger logger = Logger(
output: MultiOutput([output, ConsoleOutput()]),
filter: ProductFilter()); //Logger默认的Filter在release包中不打印日志，如需打印可以使用我们提供的ProductFilter

logger.d('你好，flutter logger!!!');
copied to clipboard
更详细使用例子可以参考 logger_writer
参考 #
flutter_socket_logger代码仓库