Skip to main content

Deployment Guide

Environment Requirements​

  • Dart Version: 2.4.0 and above
  • Flutter Version: 1.12.0 and above

Instrumentation Steps​

Flutter instrumentation is divided into two parts: native project instrumentation and Flutter plugin instrumentation.

Native Project Instrumentation​

Please ensure that the native part of the instrumented App has integrated the Tingyun SDK. If not integrated, please refer to the native project deployment documentation to complete instrumentation.

Flutter Plugin Instrumentation​

Add Dependencies​

  • Add Dependencies

    Add the Tingyun Flutter plugin to the project's pubspec.yaml file. Currently supports both remote dependency and local dependency deployment methods.

    • Remote Dependency

      dependencies:
      	tingyun_flutter_plugin: ^1.0.0

    • Local Dependency

      dependencies:
          tingyun_flutter_plugin:
              path: tingyun_flutter_plugin //tingyun_flutter_plugin needs to be replaced with the local TingYun flutter plugin directory

  • Get Plugin

    After adding dependencies, you need to execute the flutter packages get command in the project "root directory".

    Note: iOS adding dependencies requires executing the pod install command in the project ios directory.

Flutter Plugin Initialization​

  • Replace runApp()

    Need to comment out the original runApp() method and add the Tingyun().start(MyApp() method.

    import 'package:tingyun_flutter_plugin/tingyun_flutter_plugin.dart';

    void main() {
    	// runApp(MyApp());
        Tingyun().start(MyApp());
    }

  • Runtime Logs

    After running the project, the console will display the following logs:

    tingyun flutter impl start
    get configure from tingyun:xxx //xxx is the feature switch configuration obtained from the native SDK
    //Display when initialization is successful
    tingyun flutter plugin success!
    //Display when initialization fails
    tingyun flutter plugin failed to initialize. Error: xxx //xxx is the error description

Compatible Exception Data​

Since Flutter only allows a single handler to collect error data, Tingyun provides related parameters to be compatible with scenarios where the App itself collects errors.

  • Control Parameters

    We provide two parameters in the tingyun_flutter_plugin initialization method. You can choose to pass in related functions to handle errors.

    /**
    Due to Flutter error capture mechanism, we need to provide 2 different functions to handle errors,
    onError is the callback function for errors captured through runZoned when Flutter framework doesn't catch exceptions
    flutterOnError is the callback function for exceptions captured by Flutter framework through Flutter.onError

    @onError: Need to pass in a function with prototype void FunctiononError(Object, StackTrace), 
    @flutterOnError: Need to pass in a function with prototype void FunctionFlutterError(FlutterErrorDetails details)
    */
    Tingyun().start(MyApp(), {Function onError, Function flutterOnError});

  • Code Example

    void main() => Tingyun().start(MyApp(),onError: onCustomError, flutterOnError: onCustomFlutterError);

    void onCustomError(Object object, BuildContext stackTrace){
      print('onCustomError happened');
    }

    void onCustomFlutterError(FlutterErrorDetails details){
      print('onCustomFlutterError happened');
    }

Android WebView Data Collection​

Due to operating system differences, the Tingyun iOS SDK supports automatic WebView data collection by default, while Android requires adding related settings according to the following steps. Currently supports both automatic JS probe injection and manual JS probe injection.

  • Automatic JS Probe Injection

    Need to call isHookWebChromeClient(true) when initializing the SDK. The SDK will automatically replace WebChromeClient and inject JS probe.

  • Example

NBSAppAgent.setLicenseKey("Key").setRedirectHost("Host")
            .isHookWebChromeClient(true) // Automatically replace WebChromeClient and inject JS probe
            .start(getApplicationContext());

  • Manual JS Probe Injection

    Need to call the initJSMonitor() method provided by Tingyun Android SDK in WebChromeClient.

  • Example

    Using [webview_flutter-0.3.24] as an example.

    1. Open the build.gradle file in the webview_flutter-0.3.24 android directory and add TingYun_Android_SDK dependency.

      dependencies {
          compileOnly "com.networkbench:tingyun-ea-agent-android:2.15.5"   
      }

    2. Override onProgressChanged() in WebChromeClient and add TingYun_SDK's initJSMonitor() method.

      private class FlutterWebChromeClient extends WebChromeClient {

        @Override
        public void onProgressChanged(WebView view, int newProgress) {
          try {
            Class.forName("com.networkbench.agent.impl.instrumentation.NBSWebChromeClient");
            com.networkbench.agent.impl.instrumentation.NBSWebChromeClient.initJSMonitor(view, newProgress);
          } catch (ClassNotFoundException e) {
            e.printStackTrace();
          }
          super.onProgressChanged(view, newProgress);
        }
        ... ...
      }