Flutter/Dart Package for SmartConfig Provisioning of ESP Devices

Posted on by Alija Bobija

This Dart package brings EspTouch and EspTouchV2 SmartConfig protocols directly into your Flutter projects that uses ESP32. Written entirely in Dart, it integrates easily and works across Windows, Linux, macOS, Android, and iOS.

esp_smartconfig

What Is SmartConfig?

SmartConfig is a technology that helps you connect new Wi-Fi devices to a network without needing a direct connection. A mobile app sends the network credentials from your phone or tablet to the unconfigured Wi-Fi device.

In short, SmartConfig lets you connect an IoT device to Wi-Fi automatically — without plugging it in or connecting to it manually.

How SmartConfig Works

Here’s how the standard SmartConfig process works:

  • The IoT device switches to Wi-Fi monitor mode and listens for all wireless packets, including encrypted ones.
  • You open the app on your phone, enter the Wi-Fi name and password, and start the setup.
  • The app encodes the credentials in the length field of UDP broadcast packets and sends them over the air. While the data is encrypted, the packet length remains visible.
  • The IoT device reads the packet lengths, decodes the credentials, and joins the network.
  • Once connected, it notifies the app that the setup is complete.

How to use esp_smartconfig package?

This package makes it easy to add SmartConfig provisioning to your Dart or Flutter app.

To help you get started, I’ve created a step-by-step YouTube video. It walks you through the implementation and shows how to integrate the provisioning logic into your project.

For the sake of demonstration purposes I will make Dart console application, and to do that we can execute next command (it is assumed that you have installed dart on your pc):

dart create --template console smart_config_dart

Once when the previous command is executed you will get newly created project folder with the name smart_config_dart. Open that project in your favorite code editor to start with actual coding.

Open the file bin/smart_config_dart.dart and paste the next code:

import 'dart:io';

import 'package:esp_smartconfig/esp_smartconfig.dart';

void main() async {
  final provisioner = Provisioner.espTouch();

  provisioner.listen((response) {
    print("Device ($response) is connected to WiFi!");
  });

  await provisioner.start(ProvisioningRequest.fromStrings(
    ssid: "NETWORK_NAME_GOES_HERE",
    bssid: "ROUTER_BSSID_GOES_HERE",
    password: "NETWORK_PASSWORD_GOES_HERE",
  ));

  await Future.delayed(Duration(seconds: 10));

  provisioner.stop();
  exit(0);
}

Enter the correct WiFi credentials (in previous code) on which you want to connect your ESP device. If you want to connect ESP device on the same network on which your PC is connected, than you can execute next command (on Windows) to find out BSSID of your router:

netsh wlan show interfaces

Once when you have enter correct WiFi informations into the code, you can power-on your ESP device (on which is running procedure for SmartConfig packages capturing) and execute the Dart application.

When device successfully connects to the WiFi network, appropriate feedback message will be printed inside of Debug Console of Dart application. That message will contain IP address that device has got from the DHCP server, and BSSID of the device itself.

Links

Package has been published on the official Google’s Dart/Flutter registry:

https://pub.dev/packages/esp_smartconfig

Source code of the package can be found in the next GitHub repository:

https://github.com/abobija/esp-smartconfig-dart