Flutter网络请求自动埋点

简述

基于之前实现的自动全埋点插件增加了Http请求自动埋点功能

Flutter全埋点插件源码地址，只需一行配置即可自动埋点记录页面进入、退出、点击、滑动与网络请求

主要功能

• 性能监控：记录每个HTTP请求的耗时。
• 错误捕获：捕获并记录请求过程中发生的各类异常。
• 日志上报：将请求的相关信息上报服务端。

实现原理

• 通过HttpClientRequestWithChecker和HttpClientWithChecker类分别代理原始的HttpClientRequest和HttpClient对象，添加监控和日志记录功能。
• 使用Stopwatch计算每个请求的实际耗时。

核心逻辑

@override
Future<HttpClientResponse> close() async {
  return _realRequest.close()
      .then((HttpClientResponse response) {
        _checkResponse(_realRequest, response);
        return response;
      })
      .catchError((dynamic error, dynamic stackTrace) {},
                   test: (error) {
         _stopwatch.stop();

         // 构建错误消息
         String message;
         if (error is HttpException) {
           message = error.message;
         } else {
           message = error.toString();
         }

         // 上报请求信息
         Track.instance.reportHttpRequest(RequestModel(
             uri: _realRequest.uri,
             method: method,
             pageId: pageInfoData?.pageInfo?.pageKey ?? "",
             requestHeaders: AutoTrackConfigManager
                 .instance.config.httpRequestConfig!
                 .ignoreRequestHeader ? null : _realRequest.headers,
             message: message,
             status: -1,
             spent: _stopwatch.elapsedMilliseconds));

         return false;
       });
}

使用

只需调用AutoTrack().config().enableHttRequest()方法即可自动记录，详细使用方法可查看源码地址

flutter: AutoTrack [AutoTrackLoggerLevel.debug] - track request => {uri: https://xxxx/api/v1/book?tag=EXPLORE&page=2&size=10, method: GET, message: status 200: OK, pageId: CupertinoScaffold, status: 200, spent: 53, requestHeaders: null, responseHeaders: null}
flutter: AutoTrack [AutoTrackLoggerLevel.debug] - track request => {uri: https://xxxx/book/12/cover.png, method: GET, message: status 403: Forbidden, pageId: CupertinoScaffold, status: 403, spent: 98, requestHeaders: null, responseHeaders: null}