Chrome Serial API

Chrome kann per JavaScript aus der seriellen Schnittstelle lesen und in sie schreiben. Damit lassen sich leicht Tools zur Steuerung und Kontrolle umsetzen.

In Pocket speichern vorlesen Druckansicht
Lesezeit: 12 Min.
Von
  • Maik Schmidt
Inhaltsverzeichnis

Wer Projekte mit Mikrocontroller-Boards, wie zum Beispiel dem Arduino entwickelt, verwendet die serielle Schnittstelle für alle möglichen Zwecke. So gut wie immer dient sie während der Entwicklung zur Ausgabe hilfreicher Debug-Nachrichten. Oft ist sie aber auch der einzige Zugang zu einem ansonsten aufregenden Projekt, dessen Glanz aber hinter der drögen Ein- und Ausgabe eines seriellen Monitors verblasst.

Um ihre Hardware-Projekte aufzupeppen, bauen Entwickler daher gerne Frontends, die die kryptische Kommunikation auf der seriellen Schnittstelle hinter bunten Oberflächen verstecken. Aufgrund der gemeinsamen Wurzeln greifen Arduino-Fans dabei bevorzugt auf Processing zurück.

Processing basiert auf der Programmiersprache Java und vereinfacht die Entwicklung audiovisueller Effekte. Zumindest gilt das für diejenigen, die bereits mit der Java-Programmierung vertraut sind. Für alle anderen ist die Einstiegshürde recht hoch.

Einfacher wären Web-Anwendungen, die direkt über die serielle Schnittstelle mit dem Mikrocontroller kommunizieren. Schließlich ist JavaScript eine dynamische Programmiersprache, die sich verhältnismäßig leicht erlernen lässt. Darüber hinaus bieten HTML5 und CSS3 viele Möglichkeiten, um Sensor-Daten ansprechend aufzubereiten.

Bisher stand diesem Modell die mangelnde Unterstützung serieller Kommunikation durch die Browser-Hersteller entgegen. Es gibt zwar Browser-Erweiterungen wie das Seriality-Plugin, das Chrome, Firefox und Safari die serielle Kommunikation beibringt. Allerdings funktioniert diese Lösung nur unter Mac OS X. Windows- und Linux-Nutzer gehen leer aus. Außerdem scheint das Projekt nicht mehr weiterentwickelt zu werden. Es ist also nur eine Frage der Zeit, bis es mit aktuellen Browser-Versionen den Dienst versagt.
Seit Google sich verstärkt als Anbieter von Geräten engagiert, wurde der hauseigene Web-Browser nach und nach um APIs zur direkten Kommunikation mit externer Hardware erweitert. Neben Bluetooth und USB unterstützt Chrome mittlerweile auch die direkte Kommunikation über die serielle Schnittstelle. Dieser Artikel zeigt, wie sich das Arduino Esplora-Board mit einer Chrome Web-Anwendung kontrollieren lässt.

Das Esplora-Board ist Joystick und Sensor-Plattform zugleich.
Der Arduino Esplora basiert auf dem Arduino Leonardo. Bereits von Hause aus verfügt der Esplora über eine ganze Menge Sensoren und Aktoren. Das Board hat einen Analog-Joystick, vier digitale Taster, einen Licht-Sensor, einen Temperatur-Fühler, einen Dreiachsen-Beschleunigungssensor, einen Schieberegler, ein Mikrofon, einen Lautsprecher und eine RGB-LED. Auch hat der Esplora eine Vorrichtung für einen TFT-Bildschirm und bildet somit die optimale Grundlage für eine tragbare Videospiel-Konsole.

Insgesamt fallen auf dem Arduino Esplora vierzehn einzelne Sensor-Daten an. Das Arduino-Programm (hier zum Download) SensorDumper.ino gibt diese kontinuierlich als Komma-separierte Liste auf der seriellen Schnittstelle aus:

#include <Esplora.h>

void setup() {
while (!Serial);
Serial.begin(9600);
}

void loop() {
printSensorData();
delay(200);
}

void printSensorData() {
Serial.print(Esplora.readButton(SWITCH_1));
Serial.print(',');
Serial.print(Esplora.readButton(SWITCH_2));
Serial.print(',');
Serial.print(Esplora.readButton(SWITCH_3));
Serial.print(',');
Serial.print(Esplora.readButton(SWITCH_4));
Serial.print(',');
Serial.print(Esplora.readSlider());
Serial.print(',');
Serial.print(Esplora.readLightSensor());
Serial.print(',');
Serial.print(Esplora.readTemperature(DEGREES_C));
Serial.print(',');
Serial.print(Esplora.readMicrophone());
Serial.print(',');
Serial.print(Esplora.readJoystickSwitch());
Serial.print(',');
Serial.print(Esplora.readJoystickX());
Serial.print(',');
Serial.print(Esplora.readJoystickY());
Serial.print(',');
Serial.print(Esplora.readAccelerometer(X_AXIS));
Serial.print(',');
Serial.print(Esplora.readAccelerometer(Y_AXIS));
Serial.print(',');
Serial.print(Esplora.readAccelerometer(Z_AXIS));
Serial.println();
}

Eine typische Ausgabe sieht wie folgt aus:

1,1,1,1,546,1017,22,0,1023,-2,-5,-1,22,147
1,1,1,1,547,1017,22,0,1023,-2,-5,-4,20,137
1,1,1,1,547,1017,22,0,1023,-2,-5,0,21,138
1,1,1,1,546,1017,22,0,1023,-2,-5,-4,20,137

Die ersten vier Werte geben zum Beispiel den Zustand der digitalen Taster auf dem Esplora wieder. Eine 1 bedeutet, dass der Taster nicht gedrückt ist. Der fünfte Wert der Ausgabe repräsentiert den aktuellen Wert des Schiebereglers und die restlichen Werte stehen für die verbleibenden Sensor-Daten.

Sonderlich übersichtlich ist das nicht, aber die Daten lassen sich mit einer Chrome Web App leicht in einer ansprechenderen Form darstellen.