Remote logging with Flutter on the logz.io ELK stack

Marc Logemann
SaaS Startup Factory
5 min readOct 22, 2019

Letting your Flutter applications log in the cloud is a very good idea when it comes to beta test software within a closed user group. Here you want as much information about your app behaviour as possible. Having no access of the user devices log system in fact requires a cloud based application to log into. Furthermore you want a system where you can easily search your log content and submit tags like userId on each log statement.

The ELK stack of http://logz.io

The company offers an easy to integrate logging system with full search capabilities with the help of Kibana, Elasticsearch and Logstash. Apart from doing searches via their nice User-Interface, you can also do a Live-Tail, which is exactly what its name implies, a web based tail on all your logging actions. This is super nice and the delay is definitely acceptable.

They integrate with lots of framework and languages, which you can easily search via their Log Shipping menu item in the console. Unfortunately there is no easy way for flutter described, but luckily there is a package for a dart based logging system:

The mentioned package only contains appenders for the base logging system, which is also available at pub.dev at:

But lets create an account first…

Register Screen at logz.io
  • head over to https://logz.io/ and click “free trial” (there is free package available after trial if you don’t need the pro features)
  • fill out the form and have an eye on the region selection (on the left us-east-1 AWS is selected). To be sure which region you have chosen, copy it to your notepad or the likes cause you will need that information later on when connecting the client library to the service.
  • After logging in to your account, go directly to the preferences icon on the upper right corner and select Settings -> General
  • Write down the Token value unter the section Account Settings.

This is all we need to do on the logz.io side of things. Let’s continue with the configuration in Flutter.

Integrating the logz.io service

As mentioned above, there is already a nice little package which helps us connecting to the service of logz.io. Basically it uses the Bulk Data REST API of logz.io to push the data to the logging system. Configuring the appender is a bit tricky because the default URL works only for a certain zone, so chances are high that you have selected a different one upon registration and fail to connect.

So lets start by adding the two needed packages in the pubspec.yaml:

dependencies:
...
logging: ^0.11.3+2
logging_appenders: ^0.2.2

After doing flutter packages get you will have the package available in your project. Now lets write real quick a simple Hello LoggingWorld application:

import 'package:flutter/material.dart';
import 'package:logging/logging.dart';
import 'package:logging_appenders/logging_appenders.dart';

createLogger() {
Logger.root.level = Level.ALL;

LogzIoApiAppender(
apiToken: "<ACCOUNT_TOKEN_FROM_SETTINGS_GUI>",
url: "https://listener-nl.logz.io:8071/",
labels: {
"version": "1.0.0", // dynamically later on
"build": "2" // dynamically later on
},
)..attachToLogger(Logger.root);
}

void main() {
createLogger();
runApp(MyApp());
}

class MyApp extends StatelessWidget {
final _logger = Logger('com.example.helloLogging');

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Welcome to Flutter',
home: Scaffold(
appBar: AppBar(
title: Text('Welcome to Hello LoggingWorld'),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Center(
child: RaisedButton(
child: Text("Log '123' on Info"),
onPressed: () {
_logger.info("123");
},
),
),
RaisedButton(
child: Text("Log '456' on severe"),
onPressed: () {
_logger.severe("456");
},
),
],
),
),
);
}
}

Let’s go through the important lines in this code.

The parameters to LogzIoApiAppender are of course the most important part to get the connection going.

  • apiToken -> The token you have written down from the preferences account menu. So replace <ACCOUNT_TOKEN_FROM_SETTINGS_GUI> with your actual token.
  • url -> This largely depends which region you selected during registration. The example code uses West Europe (Netherlands), Azure. Use the following table to get the host of the url for your selected region:
https://listener.logz.io:8071 —> US East (Northern Virginia), AWS
https://listener-au.logz.io:8071 —> Asia Pacific (Sydney), AWS
https://listener-ca.logz.io:8071 —> Canada (Central), AWS
https://listener-eu.logz.io:8071 —> Europe (Frankfurt), AWS
https://listener-nl.logz.io:8071 —> West Europe (Netherlands), Azure
https://listener-wa.logz.io:8071 —> West US 2 (Washington), Azure
  • labels are kind of meta data for every logging statement. Its wise to use at least the version of your app or you could supply a userId after login to pinpoint problems in your software later on.

Lets start the HelloWorld Logging app

So when you start the application, you will see two buttons which will basically log to the logz.io system. But before you start clicking those, you want to login the console, click on the LiveTail tab and (important!) also click on the play button to start the tail.

When you push the buttons in the app, after some seconds delay, you will see the log statement appear. If you want to search for log statements you need to head over to the Kibana tab and click discover in the menu.

For sure you can do a lot more with this ELK stack but this wont be the scope of this article. I am pretty sure the nice folks at logz.io will help you out if you want to know more.

Disclaimer: I dont work for LogHero Ltd., the company behind logz.io. It just happened that i searched for a nice solution and the logging_appenders package brought me to logz.io.

If you want to know more about well architected cloud applications on Amazon AWS or how to use Flutter with Firebase, feel free to head over to https://okaycloud.de for more infos or reach me at the usual places in the internet.

--

--

Marc Logemann
SaaS Startup Factory

Entrepreneur & CTO - (AWS) Software Architect, likes Typescript, Java and Flutter, located in the Cloud, Berlin and Osnabrück.