Motor einfach per Handy steuern - Gunook

2024 Autor: John Day | [email protected]. Zuletzt bearbeitet: 2024-01-30 07:18

Dieses How-To zeigt, wie Sie einen smarten IoT-Servo "HDrive17" mit Ihrem Handy einfach mit HTML und JavaScript steuern. Die Webseite mit diesem Skript wird auf dem Motor selbst gespeichert und kann an eine WebApp auf Ihrem Mobiltelefon angehängt werden.

Schritt 1: HDrive17 in Ihrem lokalen Netzwerk einrichten

Verbinden Sie den HDrive17 (erhältlich unter www.henschel-robotics.ch) mit Ihrem lokalen Netzwerk, indem Sie das Ethernet-Kabel vom Motor zu Ihrem WLAN-Router stecken. Achten Sie darauf, dass Sie zuerst eine gültige IP-Adresse auf dem HDrive für Ihr Netzwerk konfiguriert haben. Die gesamte im Video gezeigte Anwendung befindet sich in einer HTML-Datei auf meinem lokalen Computer. Zunächst können Sie diese Website in Ihrem lokalen Browser testen und das HDrive von Ihrem PC aus steuern.

Wenn Sie Ihr Mobiltelefon zur Steuerung des HDrive verwenden möchten, müssen Sie diese lokale Website in Ihrem WLAN-Netzwerk veröffentlichen. Dann öffnen Sie einfach diese Website, die von Ihrem PC aus bedient wird, auf Ihrem Mobiltelefon. Um eine solche Site in Ihrem Netzwerk freizugeben, können Sie das WebMatrix-Tool oder IIS von Microsoft verwenden. Denken Sie daran, einige Netsh- und Firewall-Konfigurationen vorzunehmen, damit Ihr Mobiltelefon Zugriff auf die Seite hat.

Es ist auch möglich, die Webseite direkt auf dem Motor selbst zu speichern, dann ist kein PC mehr zwingend erforderlich.

Schritt 2: Programmanwendung

Webseitentext:

Wir verwenden das Roundslider-Skript, um das schöne Messgerät anzuzeigen, daher müssen wir das Slider-Element im Hauptteil des HTML-Dokuments hinzufügen.

Schritt 3: Webseiten-Skript

Der folgende Code sendet die neue Zielposition an das HDrive. Es beginnt mit dem Einbinden des JQuery- und des RoundSlider-Skripts. Der Rundschieber löst ein Drag-Event aus, das die Funktion „sendDataToHdrive“aufruft. Diese Funktion sendet dann einen neuen Fahrbefehl an den Motor.

Bitte schau dir diese Zeile an:

var blob = neuer Blob(['

Er sendet einen Antriebsbefehl an den HDrive mit der Zielposition, der max. Drehzahl von 2000 U/min, tha max. Strom von 2A im Modus 129 (Positionsregelung). Sie können das gesamte Projekt hier herunterladen: Slider_demo.rar

Schritt 4: Speichern Sie die Webseite direkt auf dem HDrive

Um die Webanwendung auf Ihrem Antrieb zu hosten, müssen wir die Dateien auf den Motor hochladen. Der Motor kann 4 Dateien, 2 HTML- und 2 Script-Dateien (.js) hochladen. Jede Datei wird nach dem Hochladen umbenannt. Die erste HTML-Datei wird in app1.html umbenannt, dann app2.html die Skriptdateien werden in s1.js und s2.js umbenannt. Daher müssen wir die Dateilinks in unserer HTML-Datei ändern. Die JQuery… wird zu „s2.js“. Außerdem habe ich das Roundslider-CSS in die HTML-Datei kopiert.

Rufen Sie zuerst die Web-GUI von Ihrem HDrive auf und greifen Sie auf den Abschnitt „Apps“zu

Schritt 5: Zugriff auf die App

Nach dem Hochladen dieser Dateien können Sie von jedem Gerät im selben Netzwerk auf die Seite unter der Adresse https://192.168.1.102/app1.html zugreifen, Ihr PC ist nicht mehr zwingend erforderlich, die Dateien werden direkt vom HDrive gehostet.

Laden Sie hier alle Dateien herunter.