flutter 客户端日志上传定位错误信息

背景

flutter 开发的app 安装到真机上无法定位报错信息，只能使用usb连接电脑使用adb logcat来查看日志效率低下。

想法

如果将flutter 开发的app 运行的时候将日志写进一个日志文件里面去，然后给flutter app搭建一个http服务器，后端知道对应app的ip后，直连对应app 获取日志文件。

效果如下

第一步

获取本机的ip地址放在个人中心里面

如：

flutter 获取本机ip

方式一：缺点(模拟器获取有时会获取不到) 不推荐但是必须使用

  for (var interface in await NetworkInterface.list()) {
      for (var addr in interface.addresses) {
        if (addr.type == InternetAddressType.IPv4) {
          address = addr.address.toString();
          print('IPv4 地址: ${addr.address}');
        }
        // else if (addr.type == InternetAddressType.IPv6) {
        //   print('IPv6 地址: ${addr.address}');
        //   // address = addr.address.toString();
        // }
      }
    }

方式二：

dart_ipify dart_ipify | Dart Package 这里是外网的IP(不适用)

import 'package:dart_ipify/dart_ipify.dart';
 final ipv4 = await Ipify.ipv4();
 print(ipv4); // 98.207.254.136

这里声明一下客户端日志上传只限于局域网如果是外网手机的网络ip app 内部是局域网是访问不到的

如果是外网采用用户手动触发一些列操作如去个人中心点击上报日志 (这个功能需要实现)

第二步

利用shelf flutter 的插件搭建 app内的服务器

shelf | Dart PackageA model for web server middleware that encourages composition and easy reuse.https://pub-web.flutter-io.cn/packages/shelf注意端口不能为 80

import 'package:LS/common/extension/custom_ext.dart';
import 'package:LS/common/utils/log.dart';
import 'package:dart_ipify/dart_ipify.dart';
import 'package:flutter/foundation.dart';
import 'package:shelf/shelf.dart';
import 'package:shelf/shelf_io.dart' as shelf_io;

class Server {
  static String address = "";
  static init() async {
    if (kIsWeb) {
      return;
    }
    for (var interface in await NetworkInterface.list()) {
      for (var addr in interface.addresses) {
        if (addr.type == InternetAddressType.IPv4) {
          address = addr.address.toString();
          print('IPv4 地址: ${addr.address}');
        }
        // else if (addr.type == InternetAddressType.IPv6) {
        //   print('IPv6 地址: ${addr.address}');
        //   // address = addr.address.toString();
        // }
      }
    }

    // String ipv4 = await Ipify.ipv4();
    "当前ip i $address".w();
    // address = ipv4;
    var handler =
        const Pipeline().addMiddleware(logRequests()).addHandler(_echoRequest);

    var server = await shelf_io.serve(handler, address, 8080);

    // Enable content compression
    server.autoCompress = true;

    print('Serving at http://${server.address.host}:${server.port}');
  }

  static Future<Response> _echoRequest(Request request) async {
    switch (request.requestedUri.path) {
      case '/':
        return Response.ok('Hello, World!');
      case "/log":
        var headers = {
          'content-type': 'text/plain',
          'content-disposition': 'attachment; filename="log.txt"'
        };
        String log = await Console.getLogLocalFile();
        return Response.ok(log, headers: headers);
    }

    return Response.ok('Request for "${request.url}"');
  }
}

核心代码就是

import 'package:shelf/shelf.dart';
import 'package:shelf/shelf_io.dart' as shelf_io;

void main() async {
  var handler =
      const Pipeline().addMiddleware(logRequests()).addHandler(_echoRequest);

  var server = await shelf_io.serve(handler, 'localhost', 8080);

  // Enable content compression
  server.autoCompress = true;

  print('Serving at http://${server.address.host}:${server.port}');
}

Response _echoRequest(Request request) =>
    Response.ok('Request for "${request.url}"');

main中运行服务器

  if (kDebugMode) {
    Server.init();
  }

日志是再打印的时候就会自动进行写入

日志输出同时写入app文件夹制定文件里面

///输出日志工具类
class Console {
  static const bool _isLog = true; // 是否输出日志标识
  static const bool _isDebug = kDebugMode; // 是否为debug模式
  static const String _logFlag = "app输出日志"; // 输出日志前缀

  ///日志输出,仅dubug模式下生效
  static void d(Object? object) {
    if (_isLog && _isDebug) {
      // print("$_logFlag | $object");
      // developer.log();
      Global.logger.i("$_logFlag | $object");
      if (!kIsWeb) {
        writeLogsToFile("$_logFlag | $object");
      }
    }
  }

  static log(List args) {
    if (_isLog && _isDebug) {
      // print("$_logFlag | ${args.toString()}");
      // developer.log("$_logFlag | ${args.toString()}");
      Global.logger.i("$_logFlag | ${args.toString()}");
      if (!kIsWeb) {
        writeLogsToFile("$_logFlag | ${args.toString()}");
      }
    }
  }

  // 只写日志 不输出
  static void staticWriteLogsToFile(String logs, String type) async {
    writeLogsToFile("$type | ${DateTime.now().toLocal()} | $logs}");
  }

  static Future<String> getLogsDirectory() async {
    Directory appDocDir = await getApplicationDocumentsDirectory();
    print("appDocDir==> $appDocDir");
    String logsDirectory = '${appDocDir.path}/log/api';
    Directory(logsDirectory).createSync(recursive: true);
    return logsDirectory;
  }

  static Future<void> writeLogsToFile(String logMessage) async {
    String logsDirectory = await getLogsDirectory();
    File logFile = File('$logsDirectory/app_logs.txt');
    await logFile.writeAsString('$logMessage\n', mode: FileMode.append);
  }

  static Future getLogLocalFile() async {
    String logsDirectory = await getLogsDirectory();
    File logFile = File('$logsDirectory/app_logs.txt');
    String log = await logFile.readAsString();
    return log;
  }
}

为字符串扩展方法进行打印

extension LogExt on String {
  log() {
    Global.logger.d(this);
    Console.staticWriteLogsToFile(this, "log");
  }

  t() {
    Global.logger.t(this);
    Console.staticWriteLogsToFile(this, "stackTrace");
  }

  info() {
    Global.logger.i(this);
    Console.staticWriteLogsToFile(this, "info");
  }

  errorLog() {
    Global.logger.e("Error", error: this);
    Console.staticWriteLogsToFile(this, "error");
  }

  w() {
    Global.logger.w(this);
    Console.staticWriteLogsToFile(this, "warning");
  }
}

使用如：