Flutter日志收集与分析插件flutter_bugfender的使用

发布于 1周前 作者 h691938207 来自 Flutter

Flutter日志收集与分析插件flutter_bugfender的使用

flutter_bugfender 是一个为Flutter项目提供的Bugfender封装插件,它实现了原生代码以支持日志记录和崩溃报告等功能。需要注意的是,该插件由社区提供,因此按照“现状”发布,官方支持可能有限。

使用包

添加依赖

首先,在 pubspec.yaml 文件中添加 flutter_bugfender 依赖:

dependencies:
  flutter:
    sdk: flutter
  flutter_bugfender: ^3.0.0

然后运行 flutter pub get 来下载安装这个包。

初始化插件

lib/main.dart 中导入插件:

import 'package:flutter_bugfender/flutter_bugfender.dart';

并在 main() 函数中初始化插件,包裹 runApp() 调用:

void main() {
  FlutterBugfender.handleUncaughtErrors(() async {
    await FlutterBugfender.init("YOUR_APP_KEY",
        enableCrashReporting: true, // 可选但推荐开启
        enableUIEventLogging: true,
        enableAndroidLogcatLogging: true);
    FlutterBugfender.log("hello world!");
    runApp(new MyApp());
  });
}

更多初始化选项

  • apiUribaseUri: 用于自定义服务器地址(适用于本地部署)
  • maximumLocalStorageSize: 设置本地日志缓存的最大大小(字节)
  • printToConsole: 是否打印到控制台
  • enableUIEventLogging: 自动记录用户交互事件的日志
  • enableCrashReporting: 自动报告原生崩溃信息
  • enableAndroidLogcatLogging: 自动记录Android Logcat日志
  • overrideDeviceName: 设备名称(已弃用,建议使用 FlutterBugfender.setDeviceString() 替代)

其他功能调用示例

FlutterBugfender.log("Working fine!");
FlutterBugfender.fatal("Fatal sent!");
FlutterBugfender.error("Error sent!");
FlutterBugfender.warn("Warning sent!");
FlutterBugfender.info("Info sent!");
FlutterBugfender.debug("Debug sent!");
FlutterBugfender.trace("Trace sent!");
FlutterBugfender.sendLog(
 line: 42,
 method: "someMethod()",
 file:"someFile",
 level: LogLevel.info,
 tag: "Custom tag",
 text: "This is a custom log"
);
FlutterBugfender.setDeviceString("user.email", "example@example.com");
FlutterBugfender.setDeviceInt("user.id", 32);
FlutterBugfender.setDeviceFloat("user.pi", 3.14);
FlutterBugfender.setDeviceBool("user.enabled", true);
FlutterBugfender.removeDeviceKey("user.pi");
FlutterBugfender.sendCrash("Test Crash", "Stacktrace here!");
FlutterBugfender.sendIssue("Test Issue", "Issue value goes here!");
FlutterBugfender.sendUserFeedback("Test user feedback", "User feedback details here!");
FlutterBugfender.setForceEnabled(true);
FlutterBugfender.forceSendOnce();
FlutterBugfender.getDeviceUri();
FlutterBugfender.getSessionUri();
FlutterBugfender.getUserFeedback(); // 显示请求反馈的屏幕

报告Dart和Flutter异常

对于更精细的错误处理控制,可以替换 handleUncaughtErrors() 调用如下:

// 捕获Flutter错误
FlutterError.onError = (FlutterErrorDetails details) async {
  FlutterError.presentError(details);
  await FlutterBugfender.sendCrash(details.exception.toString(), details.stack?.toString() ?? "");
};
// 捕获Dart异常
runZonedGuarded(() {
  runApp(new MyApp());
}, (Object error, StackTrace stack) async {
  await FlutterBugfender.sendCrash(error.toString(), stack.toString());
});

完整示例Demo

下面是一个完整的示例应用,展示了如何集成和使用 flutter_bugfender

import 'package:flutter/material.dart';
import 'package:flutter_bugfender/flutter_bugfender.dart';

void main() {
  FlutterBugfender.handleUncaughtErrors(() async {
    await FlutterBugfender.init("<INSERT YOUR BUGFENDER APP KEY>",
        printToConsole: true,
        enableCrashReporting: true,
        enableAndroidLogcatLogging: false,
        version: "1.0",
        build: "555");
    FlutterBugfender.log("hello world!");
    runApp(new MyApp());
  });
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _message = 'Bugfender not started';

  @override
  void initState() {
    super.initState();
    initPlatformState();
  }

  Future<void> initPlatformState() async {
    try {
      FlutterBugfender.log("Working fine!");
      FlutterBugfender.fatal("Fatal sent!");
      FlutterBugfender.error("Error sent!");
      FlutterBugfender.warn("Warning sent!");
      FlutterBugfender.info("Info sent!");
      FlutterBugfender.debug("Debug sent!");
      FlutterBugfender.trace("Trace sent!");
      FlutterBugfender.sendLog(
          line: 42,
          method: "fakeMethod()",
          file: "fakeFile.fake",
          level: LogLevel.info,
          tag: "TAG",
          text: "Custom log 1");

      FlutterBugfender.sendLog(tag: "TAG", text: "Custom log 2");
      FlutterBugfender.setDeviceString("user.email", "example@example.com");
      FlutterBugfender.setDeviceInt("user.id", 1);
      FlutterBugfender.setDeviceFloat("user.weight", 1.234);
      FlutterBugfender.setDeviceBool("user.team", true);
      FlutterBugfender.removeDeviceKey("user.team");
      print(await FlutterBugfender.sendCrash("Test Crash", "Stacktrace here!"));
      print(await FlutterBugfender.sendIssue("Test Issue", "Issue value goes here!"));
      print(await FlutterBugfender.sendUserFeedback("Test user feedback", "User feedback details here!"));
      FlutterBugfender.setForceEnabled(true);
      FlutterBugfender.setForceEnabled(false);
      FlutterBugfender.forceSendOnce();
      print(await FlutterBugfender.getDeviceUri());
      print(await FlutterBugfender.getSessionUri());
    } catch (e) {
      print("Error found!!!! $e");
      throw e;
    }

    if (!mounted) return;

    setState(() {
      _message = "All working fine!";
    });
  }

  void getUserFeedback() async {
    print(await FlutterBugfender.getUserFeedback());
  }

  void generateException() async {
    var result = 100 ~/ 0; // 这将导致除以零异常
  }

  void generateError() {
    throw Error(); // 手动生成一个错误
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Bugfender Plugin example app'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Text('$_message\n'),
              ElevatedButton(
                onPressed: () {
                  getUserFeedback();
                },
                child: Text('Show Feedback Screen'),
              ),
              ElevatedButton(
                onPressed: () {
                  generateException();
                },
                child: Text('Generate exception'),
              ),
              ElevatedButton(
                onPressed: () {
                  generateError();
                },
                child: Text('Generate error'),
              )
            ],
          ),
        ),
      ),
    );
  }
}

以上示例展示了一个基本的应用程序框架,其中包括了如何使用 flutter_bugfender 插件来记录日志、发送崩溃报告以及获取用户反馈等操作。请确保根据实际需要调整代码中的参数和逻辑。


更多关于Flutter日志收集与分析插件flutter_bugfender的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter日志收集与分析插件flutter_bugfender的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中集成和使用flutter_bugfender插件来进行日志收集与分析的代码示例。

1. 添加依赖

首先,你需要在你的pubspec.yaml文件中添加flutter_bugfender依赖。

dependencies:
  flutter:
    sdk: flutter
  flutter_bugfender: ^x.y.z  # 请替换为最新版本号

2. 安装依赖

保存pubspec.yaml文件后,运行以下命令来安装依赖:

flutter pub get

3. 配置Bugfender

在配置Bugfender之前,你需要先在Bugfender官网注册并创建一个应用,获取应用的API Key。

在iOS上配置

  • 打开ios/Runner/Info.plist文件,并添加以下键和值来配置Bugfender:
<key>BugfenderApiKey</key>
<string>YOUR_BUGFENDER_API_KEY_HERE</string>
  • 确保在ios/Podfile中启用了Swift支持(如果尚未启用):
platform :ios, '10.0'

# ...

target 'Runner' do
  use_frameworks!  # 确保这一行被取消注释
  # ...
end

然后运行pod install来更新Pods。

在Android上配置

  • 打开android/app/src/main/AndroidManifest.xml文件,并在<application>标签内添加以下meta-data:
<meta-data
    android:name="com.bugfender.sdk.API_KEY"
    android:value="YOUR_BUGFENDER_API_KEY_HERE" />

4. 初始化Bugfender

在你的Flutter应用的入口文件(通常是lib/main.dart)中初始化Bugfender。

import 'package:flutter/material.dart';
import 'package:flutter_bugfender/flutter_bugfender.dart';

void main() {
  // 初始化Bugfender
  FlutterBugfender.initialize(apiKey: "YOUR_BUGFENDER_API_KEY_HERE");

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  void _sendLog() {
    // 发送自定义日志
    FlutterBugfender.log("This is a custom log message.");
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Flutter Bugfender Example"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Press the button to send a log message.',
            ),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _sendLog,
              child: Text('Send Log'),
            ),
          ],
        ),
      ),
    );
  }
}

5. 运行应用

现在你可以运行你的Flutter应用,并按下按钮发送日志消息到Bugfender。你可以在Bugfender的仪表板上查看和分析这些日志。

注意事项

  • 确保你已经替换了YOUR_BUGFENDER_API_KEY_HERE为你从Bugfender获取的API Key。
  • 根据你的需求,你可以进一步配置Bugfender,比如设置日志级别、启用或禁用特定日志类型等。

通过以上步骤,你应该能够在Flutter应用中成功集成并使用flutter_bugfender插件进行日志收集与分析。

回到顶部