Jump to content

Steuerung per Browser


Recommended Posts

Um es voraus zu schicken: Meine Programmierkenntnisse stammen aus dem SPS-Bereich und Basic-Dialekten. Mit Python bin ich inzwischen auf dem "es geht ja!" Level...

 

Ich möchte also vom Browser über Buttons bestimmte Aktionen an Tinkerforge-Stacks schicken. Und komme dabei einfach nicht weiter. Zum Einlesen von Sensorwerten gibt es ja Beispiele, aber zur Ausgabe habe ich so recht nichts gefunden (trotz längerem googeln).

 

Kann mir jemand den grundsätzlichen Ablauf über Java Script erklären? Und - bitte - einen kurzen Beispiel-Code anfügen?

 

Danke,

MOS FET

Link zu diesem Kommentar
Share on other sites

  • 1 month later...

Du kannst das direkt mit JavaScript machen:

Schau mal hier (Temperatur auslesen):

http://www.tinkerforge.com/en/doc/Software/Bricklets/Temperature_Bricklet_JavaScript.html#simple-html

oder hier (Relais schalten):

http://www.tinkerforge.com/en/doc/Software/Bricklets/DualRelay_Bricklet_JavaScript.html#simple-html

 

Weitere Möglichkeit wenn du Web UI's bauen willst: Installiere einen Web Server und benutze ein Binding deiner Wahl (PHP, Python, Java.....).

In der Methode in der du den Request verarbeitest kannst du dann eine IPConnection aufmachen, den Sensor Wert lesen und zum Schluss das HTML/JavaScript/CSS an den Browser zurücksenden (Response).

 

Die letzte Möglichkeit ist ein natives UI (kein Web) zu verwenden. Das hängt dann mehr von der Programmiersprache ab, wie du das machen willst.

Java -> SWT, Swing, Java FX, QT

Python -> TkInter, QT......

....

Link zu diesem Kommentar
Share on other sites

Das geht in Summe extrem gut und super einfach per JavaScript. Der große Vorteile: Du brauchst solange eigentlich kein Backend, wie Du nur die Daten von den Stacks verarbeitest. Erst wenn Du auch Einstellungen speichern möchtest oder es leistungsfähiger sein muss, brauchst Du ein einfaches Backend. (starte ersteinmal ohne)

 

Der Ablauf ist eigentlich simpel und die Beispiele von Tinkerforge sind da fast alles was man braucht (neben Grundsätzlichem).

 

Wie läuft es ab? In etwa so:

1) Du hast ein HTML Gerüst (meist mit CSS schön gemacht).

2) Du bindest ein geeignetes Framework ein, um es etwas leichter zu haben. (die Tf Skripte nutzen für DOM-Operationen direkt JS, was auch performanter ist) Typische Frameworks sind jQuery oder Angular.

..<head><script src="jquery.js"></script>..

3) Du nimmst das JS Beispiel von Tf und liest die Werte aus und schreibst diese in das DOM.

..<div id="SensorWert"></div>..<script>..$('#SensorWert').html(DerErmittelteWert);..</script>..

4) Wenn dann etwas getan werden soll entweder über einen Button

..<input id="Schalter" type="button" />..<script>$('#Schalter').on('click',function() { ..Hier das Schlaten wie im Tf Beispiel.. });..</script>

oder direkt per Code, wenn ein Schwellwert erreicht wurde. Das wäre dann die Aktion in einem Callback, wie Du sie in den Tf Beispielen findest.

 

Zu kurz um es verstanden zu haben, aber vielleicht ein wenig brauchbares dabei?!

Link zu diesem Kommentar
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Gast
Reply to this topic...

×   Du hast formatierten Text eingefügt.   Formatierung jetzt entfernen

  Only 75 emoji are allowed.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Dein vorheriger Inhalt wurde wiederhergestellt.   Clear editor

×   Du kannst Bilder nicht direkt einfügen. Lade Bilder hoch oder lade sie von einer URL.

×
×
  • Neu erstellen...