Forum: Compiler & IDEs Textbox in AVR NET IO


von Siegfried (Gast)


Lesenswert?

Guten Abend,
ich weiß zwar  nicht ob ich im richtigen Forum bin hoffe aber trotzdem 
auf Eure Hilfe.
Ich  betreibe auf dem AVR NET IO Board von Pollin den Webserver von 
Ulrich Radig, und möchte nun für meine Anwendung die Webseite anpassen.
Nun zu meinem Problem, ich hatte bis jetzt mit dem ganzen Ethernet und 
Webseiten Zeugs nichts am Hut(leider)! Ich möchte Auf der Webseite eine 
Textbox anlegen und diese ständig aktualisieren ohne die ganze Seite neu 
zu laden. Soviel ich verstanden habe ist so was mit ein wenig Javaskript 
machbar. Stimmt das? Wo kann man sich auf diesem Gebiet schlau machen 
welche Werkzeuge benötige ich um das ganze zu Debugen? Google hat mir 
nicht helfen können da ich nicht weiß wonach ich suchen muss, könnt ihr 
mir ein paar gute Stichwörter verraten!

Hoffe ich habe mich richtig ausgedrückt damit Ihr mir helfen könnt!

Vielen Dank für Eure Hilfe

Siegfried

von Siegfried (Gast)


Lesenswert?

PS wenn jemand ein Beispiel hätte wäre auch nicht schlecht !!

Danke und schönen Abend

von holger (Gast)


Lesenswert?


von Mark .. (mork)


Lesenswert?

Siegfried schrieb:
> Ich möchte Auf der Webseite eine
> Textbox anlegen und diese ständig aktualisieren ohne die ganze Seite neu
> zu laden.

Soetwas wird hierzulande AJAX genannt. Darüber wird google mehr als 
genug rausspucken.

MfG Mark

von Peter D. (pdiener) Benutzerseite


Lesenswert?

Man könnte die Textbox auch in einen eigenen Frame packen, und nur der 
wird regelmäßig komplett aktualisiert. Das dürfte auf dem Net-IO 
einfacher sein.

Grüße,

Peter

von Christian R. (mrrotzi)


Lesenswert?

hmmm ... aber ein mini-AJAX-Framework für unsere POLLIN, Radig & Co 
WebServer wär doch mal cool!

Ich denke auch schon darüber nach - wenn da nicht der Zeitmangel wäre 
...

von Mark .. (mork)


Lesenswert?

Also eigentlich muss man am Server garnichts ändern, um AJAX zu 
verwenden. Aus der Sicht des Servers ist jeder neue Request ein ganz 
normales Anfordern einer Datei, also das gleiche, was beim Neuladen 
eines Frames geschehen würde. Nur wird es eben im Browser anders 
verarbeitet.

MfG Mark

von Andreas F. (aferber)


Lesenswert?

Christian R. schrieb:
> aber ein mini-AJAX-Framework für unsere POLLIN, Radig & Co
> WebServer wär doch mal cool!

Da: http://www.timewaster.de/the-smallest-ajax-framework-ever/

Merke: AJAX ist Sache des Clients, nicht des Servers. Allerdings muss 
meistens der Server Platz für den Javascript-Code haben, deshalb wird es 
mit gängigen Frameworks wie jQuery (minified 24kB) oder Prototype 
(144kB) auf einem AVR recht eng.

Andreas

von Christian R. (mrrotzi)


Lesenswert?

Ganz richtig, aber ein paar kleine Demo-Seiten wären natürlich sehr 
hilfreich.
Ich werd mal meine webpage.h anpassen und herzeigen.

von Christian R. (mrrotzi)


Lesenswert?

Andreas Ferber schrieb:
>
> Da: http://www.timewaster.de/the-smallest-ajax-framework-ever/
>

...
ajax = new ActiveXObject("Msxml2.XMLHTTP");
...

wird wahrscheinlich nicht auf einem Safari (iPhone) funktionieren!?

von Andreas F. (aferber)


Lesenswert?

Christian R. schrieb:
> ajax = new ActiveXObject("Msxml2.XMLHTTP");
> ...
>
> wird wahrscheinlich nicht auf einem Safari (iPhone) funktionieren!?

Nö, aber wenn du den ganzen Code betrachtest anstatt nur einzelne Zeilen 
rauszupicken wirst du feststellen, dass besagte Zeile beim Safari 
überhaupt nicht erreicht wird. Gilt übrigens für jeden Browser ausser 
dem IE...

Andreas

von Christian R. (mrrotzi)


Lesenswert?

Mist! Erwischt!

von Andreas F. (aferber)


Lesenswert?

Andreas Ferber schrieb:
> Merke: AJAX ist Sache des Clients, nicht des Servers. Allerdings muss
> meistens der Server Platz für den Javascript-Code haben, deshalb wird es
> mit gängigen Frameworks wie jQuery (minified 24kB) oder Prototype
> (144kB) auf einem AVR recht eng.

Hierzu noch eine Ergänzung: wenn man davon ausgehen kann, dass der 
zugreifende Client immer auch eine Internetverbindung hat, dann kann man 
die genannten Frameworks auch direkt über einen CDN-Server aus dem 
Internet einbinden (siehe z.B. 
http://docs.jquery.com/Downloading_jQuery#CDN_Hosted_jQuery und 
http://code.google.com/apis/libraries/devguide.html). Damit spart man 
sich den Platz auf dem Device selbst, ist aber auf eine funktionierende 
Internetverbindung des Clients angewiesen.

Alternativ kann man evtl. auch das Interface so gestalten, dass es auch 
ohne das Javascript-Framework grundlegend benutzbar ist, wenn auch 
vielleicht nicht so komfortabel (Stichwort "Graceful Degradation").

Andreas

von Rufus Τ. F. (rufus) Benutzerseite


Lesenswert?

Die hier erforderliche Kernfunktionalität kann man übrigens auch 
komplett ohne Ajax-Framework hinbekommen, das sind nur ein paar Zeilen 
Javascript.

Zunächst wird ein XMLHttpRequest-Objekt erzeugt:
1
if (window.ActiveXObject)
2
  oXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
3
else if (window.XMLHttpRequest)
4
  oXmlHttp = new XMLHttpRequest();

Das enthält bereits die erforderliche Browserweiche, um mit IE und 
"richtigen" Browsern (Mozilla, Opera, Safari etc.) zu funktionieren.

Dieses Objekt kann nun in einer zyklisch aufzurufenden Funktion dazu 
verwendet werden, Daten beim Webserver anzufragen.
1
window.setTimeout("Timerfunktion()", 1000);

Das initialisiert eine im Sekundentakt aufgerufene Funktion.

Diese Funktion reinitialisiert den Timer, damit sie nach einer Sekunde 
wieder aufgerufen wird und fordert beim Webserver Daten an:
1
function Timerfunktion()
2
{
3
  window.setTimeout("Timerfunktion()", 1000);
4
5
  oXmlHttp.abort();
6
7
  oXmlHttp.onreadystatechange = handleStateChange;
8
9
  oXmlHttp.open("POST", strUrl, true);
10
11
  oXmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
12
13
  oXmlHttp.send(strRequest);
14
}

strUrl ist die abgefragte URL, strRequest sind die per POST 
übergebenen Daten.

handleStateChange ist eine Funktion, die aufgerufen wird, wenn sich 
der Status des XMLHttpRequest-Objekts ändert
1
function handleStateChangeDpBlock()
2
{
3
  if (oXmlHttp.readyState == 4)
4
  {
5
    if (oXmlHttp.status == 200)
6
    {
7
      strResult = oXmlHttp.responseText;
8
      // was damit machen
9
    }
10
  }
11
}

Mit dem in strResult zurückgegebenen Text kann z.B. ein <div>-Element 
gefüllt werden, das geht auch mit der Textbox, nach der der 
Threadstarter fragte.

Die anzufragende URL sollte halt keine komplette Webseite zurückgeben, 
sondern nur den in der Textbox anzuzeigenden Text.

Das aber ist, wenn man den Webserver im Griff hat, eher gar kein 
Problem.

Auch wenn bei Ajax das X für XML steht, und auch das 
XMLHttpRequest-Objekt das XML im Namen führt, zwingt einen niemand, hier 
XML zu verwenden. Die Anfrage an den Webserver kann ganz simple Daten 
enthalten, und auch die Antwort kann ebenso einfach strukturiert werden.

von Siegfried (Gast)


Lesenswert?

Guten Abend,
Vielen Dank für die vielen Infos!
Kann momentan zwar noch nicht viel damit anfangen! Bin eben auf diesem 
Gebiet leider überhaupt nicht fit, hoffe allerdings das ich mich in 
diese Materie einarbeiten kann!
Habe allerdings gleich noch mal eine Frage.
Kann ich so eine Webseite auch auf dem Pc testen (also ohne Net IO 
Hartware)?
Ich möchte lieber von einer Sicheren Plattform starten!
Vielen Dank

schönen Abend

Siegfried

von Tom M. (tomm) Benutzerseite


Lesenswert?

Siegfried schrieb:
> Kann ich so eine Webseite auch auf dem Pc testen (also ohne Net IO
> Hartware)?
> Ich möchte lieber von einer Sicheren Plattform starten!

Natürlich, mit einem Webserver nach Wahl. Dass du dir die Frage nicht 
selbst beantworten kannst lässt mich allerdings befürchten, dass du mit 
der Antwort nicht weit kommst... 8)

Auf Linux/BSD würd ich dazu kurzerhand thttpd installieren und die Site 
im Standardverzeichnis plazieren. Mit Windows kenn ich mich nicht so gut 
aus, ist der IIS standardmässig dabei? Gibt sicher auch kleine 
kostenlose Alternativen, irgend ein Gratis-Webhoster tut's auch, 
Hauptsache du kriegst deine Dateien irgendwie auf den Server. Dann wirst 
du ev. eine eigene Domain haben müssen, damit's mit dem Abrufen auch 
klappt.

von Siegfried (Gast)


Lesenswert?

Tom M. schrieb:
> Auf Linux/BSD würd ich dazu kurzerhand thttpd installieren

Leider bin ich Windows User!
Trotzdem Danke

Siegfried

von Mark .. (mork)


Lesenswert?

Für Windows ist XAMPP ( 
http://www.apachefriends.org/de/xampp-windows.html ) eine gute Wahl, 
vorallem weil man da am Anfang nicht viel rumfummeln muss. Einfach 
installieren und es läuft.

MfG Mark

von Christian R. (mrrotzi)


Lesenswert?

>
> Leider bin ich Windows User!
>

Da muß man nicht leider sagen!!

Ja, XAMPP verwende ich auch seit langer Zeit!
Läuft bei mir unter Windows 7 64Bit ohne Probleme.
Ein Tipp: direkt auf C: installieren!

von Siegfried (Gast)


Lesenswert?

Dankeschön werde gleich mal Xampp ausprobieren!

Siegfried

von Mark .. (mork)


Angehängte Dateien:

Lesenswert?

So hab jetzt mal ein kleines Beispiel zusammengestellt. Einfach den 
Zip-Ordner in htdocs von XAMPP auspacken und durch 
http://127.0.0.1/ajax/ajax_bsp.html im Browser öffnen. (nicht auf die 
Datei ajax_bsp.html doppelklicken, weil diese dann vom Browser lokal 
geöffnet wird und die HTTP-Anfragen nicht funktionieren.)

Die Seite hat eine Textbox und zwei Buttons zum Laden und Löschen. Beim 
Laden wird die Datei "nachricht.txt" vom Server angefordert und dessen 
Inhalt in die Textbox geschrieben. Alternativ kann man natülich wie oben 
erwähnt mit Hilfe von setTimeout() die Textbox jede Sekunde automatisch 
aktualisieren lassen.

MfG Mark

von Siegfried (Gast)


Lesenswert?

Guten Abend,
ich habe ein Wenig mit dem Beispiel von Mark gespielt, dabei ist mir 
aufgefallen   das der Text aus dem txt File nur einmal geladen wird bis 
solange man im Firefox nicht die neuste Chronik löscht!
Woran kann dass liegen?

Schönen Abend
Siegfried

von Rufus Τ. F. (rufus) Benutzerseite


Lesenswert?

Das (mit nur einem 's') liegt daran, daß Firefox die Datei im Cache 
zwischenspeichert und der Webserver nicht mitteilt, daß die Datei 
jedesmal neu zu laden ist.
Letzteres erfolgt im HTTP-Header unter "cache control", siehe 
http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html im Abschnitt 
14.9.

von Pier S. (bigpier)


Lesenswert?

Schönen guten Abend,
entschuldigt mich Bitte das ich diesen Trend nochmals aufwärme.
Ich bin in Sachen Java Skript absolut nicht Fit. Möchte aber so wie der 
Threadstarter  gewisse Inhalte der Webseite auf dem Avr Net IO ständig 
aktualisieren ohne Ständig die Ganze Seite neu zu laden!
Zu meiner Frage welche URL ist hier gemeint

Rufus t. Firefly schrieb:
> strUrl ist die abgefragte , strRequest sind die per POST
> übergebenen Daten.

Ich hoffe es nimmt sich jemand die Zeit um mir ein wenig unter die Arme 
zu greifen

Gruß
Peter

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.