Flutter里面错误捕获的正确方法
背景
我们知道,在软件开发过程中,错误和异常总是在所难免。
不管是客户端的逻辑错误导致的,还是服务器的数据问题导致的,只要出现了异常,我们都需要一个机制来通知我们去处理。
在 APP 的开发过程中,我们通过一些第三方的平台,比如 Fabric、Bugly 等可以实现异常的日志上报。
Flutter 也有一些第三方的平台,比如 Sentry 可以实现异常的日志上报。
但是为了更加通用一些,本篇不具体讲解配合某个第三方平台的异常日志捕获,我们会告知大家如何在 Flutter 里面捕获异常。
至于具体的上报途径,不管是上报到自家的后台服务器,还是通过第三方的 SDK API 接口进行异常上报,都是可以的。
Demo 初始状态
首先我们新建 Flutter 项目,修改 main.dart 代码如下:
import 'package:flutter/material.dart';
void main() = runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Flutter Crash Capture'),),
body: MyHomePage(),
),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container();
}
}
效果如下:
捕获错误
我们修改 MyHomePage,添加一个 List 然后进行越界访问,改动部分代码如下:
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
List<String numList = ['1', '2'];
print(numList[6]);
return Container();
}
}
可以看到控制台报错如下:
flutter: ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════ flutter: The following RangeError was thrown building MyHomePage(dirty): flutter: RangeError (index): Invalid value: Not in range 0..1, inclusive: 6
当然这些错误信息在界面上也有显示(debug 模式)。
那么我们如何捕获呢?
其实很简单,有个通用模板,模板为:
import 'dart:async';
import 'package:flutter/material.dart';
Future<Null main() async {
FlutterError.onError = (FlutterErrorDetails details) async {
Zone.current.handleUncaughtError(details.exception, details.stack);
};
runZoned<Future<void (() async {
runApp(MyApp());
}, onError: (error, stackTrace) async {
await _reportError(error, stackTrace);
});
}
Future<Null _reportError(dynamic error, dynamic stackTrace) async {
// TODO
}
在 TODO 里面就可以执行埋点上报操作或者其他处理了。
完整例子如下:
import 'dart:async';
import 'package:flutter/material.dart';
Future<Null main() async {
FlutterError.onError = (FlutterErrorDetails details) async {
Zone.current.handleUncaughtError(details.exception, details.stack);
};
runZoned<Future<void (() async {
runApp(MyApp());
}, onError: (error, stackTrace) async {
await _reportError(error, stackTrace);
});
}
Future<Null _reportError(dynamic error, dynamic stackTrace) async {
print('catch error='+error);
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Flutter Crash Capture'),),
body: MyHomePage(),
),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
List<String numList = ['1', '2'];
print(numList[6]);
return Container();
}
}
运行可以看到控制台捕获到错误如下:
flutter: catch error=RangeError (index): Invalid value: Not in range 0..1, inclusive: 6
assert 妙用
我们知道,一般错误上报都是在打包发布到市场后才需要。
平时调试的时候如果遇到错误,我们是会定位问题并修复的。
因此在 debug 模式下,我们不希望上报错误,而是希望直接打印到控制台。
那么,这个时候就需要一种方式来区分现在是 debug 模式还是 release 模式,怎么区分呢?
这个时候就需要用到 assert 了。
bool get isInDebugMode {
// Assume you're in production mode.
bool inDebugMode = false;
// Assert expressions are only evaluated during development. They are ignored
// in production. Therefore, this code only sets `inDebugMode` to true
// in a development environment.
assert(inDebugMode = true);
return inDebugMode;
}
从注释也可以知道,assert 表达式只在开发环境下会起作用,在生产环境下会被忽略。
因此利用这一个,我们就可以实现我们的需求。
上面的结论要验证也很简单,我们就不演示了。
完整模板
import 'dart:async';
import 'package:flutter/material.dart';
Future<Null main() async {
FlutterError.onError = (FlutterErrorDetails details) async {
if (isInDebugMode) {
FlutterError.dumpErrorToConsole(details);
} else {
Zone.current.handleUncaughtError(details.exception, details.stack);
}
};
runZoned<Future<void (() async {
runApp(MyApp());
}, onError: (error, stackTrace) async {
await _reportError(error, stackTrace);
});
}
Future<Null _reportError(dynamic error, dynamic stackTrace) async {
// TODO
}
bool get isInDebugMode {
// Assume you're in production mode.
bool inDebugMode = false;
// Assert expressions are only evaluated during development. They are ignored
// in production. Therefore, this code only sets `inDebugMode` to true
// in a development environment.
assert(inDebugMode = true);
return inDebugMode;
}
debug 模式下,直接将错误打印到控制台,方便定位问题。
release 模式下,将错误信息收集起来,上传到服务器。
参考链接:
Report errors to a service
总结
以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对ZaLou.Cn的支持。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- JVM层GC调优(下)
- pytest封神之路第一步 tep介绍
- kubernetes(十六) k8s 弹性伸缩
- Mockito鸡尾酒第一杯 Java单测Mock
- kubernetes(十七) Helm V3 入门到放弃
- Dockerfile文件万字全面解析
- Go测试开发(一) 怎么写Go代码
- kubernetes(十八)集群网路
- Nginx性能监控与调优
- pytest封神之路第二步 132个命令行参数用法
- Jumpserver2.2部署文档
- Golang多线程简单斗地主
- Tomcat性能监控与调优
- Vue+SpringBoot项目实战(一) 搭建环境
- kubernetes(十九) Ceph存储入门