Wat gebruiken voor dynamische web pagina's (scada)

[Baron]

Sinds enkele jaren heb ik de overstap naar de automatiserings wereld. Daardoor ben ik niet meer mee met de laatste technieken omtrend web design.

Nu ik terug wat C# heb moeten programmeren, kriebelen mijn vingers om hiermee terug wat te te doen.

Ik zou graag een web gebasseerde mini-scada systeem bouwen. Praktisch gezien wil ik live temperaturen en alarmen laten zien. Deze signalen komen via OPC binnen.
Dus op basis van externe events moeten de waarden op scherm wijzigen (zonder zelf te moeten refreshen).

Mijn enige probleem is dat ik niet weet welke techniek hiervoor ik moet gebruiken.
Voor mij is een webpagina iets statisch in die zin dat het enkel reageert op events van een gebruiker en niet op events van buitenaf.
Van termen als Ajax, JQuery, HTML5 weet ik dat ze bestaan, maar ik weet niet wat ze kunnen.
Ik vermoed dat ASP.NET en HTML5 wel zal kunnen doen wat ik wil, maar ik weet niet waar te beginnen.
Wat ik niet wil gebruiken zijn Flash of Silverlight omdat ik denk dat stilaan uitgerangeerd wordt.

Graag zou van jullie enkele keywords hebben waarmee ik meer gericht kan zoeken naar voorbeelden op internet.

[ Voor 4% gewijzigd door Baron op 02-03-2012 08:29 ]

[azerty]

Je zult een back-end nodig hebben (ASP.NET bijv.), en dan een pagina die periodiek de nieuwe data afhaalt op die back-end. Dit kan vziw niet met HTML5, maar wel met AJAX/Jquery, in combinatie met een timer.

Een andere (simpelere) oplossing is een pagina die de data weergeeft, en dan met javascript onload een timer zetten om de pagina in zijn geheel om de x seconden te verversen... (zoek op javascript auto reload)

[YopY]

Er zijn (globaal gezien) eigenlijk maar twee oplossingen voor je probleem: Polling en pushing. Polling doe je door elke X seconden een AJAX request te doen op je back-end, en aan de hand van wat je ermee terugkrijgt de waarden op je scherm te veranderen. Pushing is andersom, waarbij je server de data naar de gebruiker stuurt (en da's stiekem de betere oplossing).

Pushing op het web is redelijk nieuw, alhoewel het al jaren in ontwikkeling is. WebSockets moet de definitieve standaard worden hiervoor; effectief houdt je browser hiermee een persistente verbinding open met je server, en stuurt je server live data naar de browser.

Maar het lijkt erop dat je eerst nog een bakkes aan zaken mag leren: ik noem HTML, Javascript, CSS, AJAX (icm bijv. JQuery), evt. graphics renderen in een Canvas-element, en natuurlijk server-side software (wat je keuze daarbij maar mag zijn).

[Baron]

WebSockets lijkt op het eerste zicht het buzzwoord naar waar ik op zoek ben.

Hier kan ik mee verder. Dank u wel.

[Noxious]

WebSockets is mooi, maar nog wel heel erg kinderschoenen.
AJAX is de 'veilige' keuze, maar daar moet je wel uitgaan van een kleine vertraging (seconden of minder).

Wat WebSockets betreft zul je hier waarschijnlijk zelf een server voor moeten schrijven of gebruik moeten maken van een experimenteel project zoals bijv. deze:
http://code.google.com/p/pywebsocket/

Hier ook nog wat informatie over een WebSockets server geschreven in C#, en wat info over het gebruik er van in ASP.NET:

http://stackoverflow.com/...c-sharp-web-socket-server
http://www.undisciplinedb...et-client-implementation/

[creator1988]

Noxious schreef op vrijdag 02 maart 2012 @ 10:32:
WebSockets is mooi, maar nog wel heel erg kinderschoenen.

Gewoon socket.io gebruiken die abstraheert alles voor je en doet fallbacks naar flash sockets, of zelfs long polling als je browser het niet ondersteunt.

[YopY]

creator1988 schreef op vrijdag 02 maart 2012 @ 11:17:
[...]


Gewoon socket.io gebruiken die abstraheert alles voor je en doet fallbacks naar flash sockets, of zelfs long polling als je browser het niet ondersteunt.

Of gebruik een library die zelf automagisch fallback doet - ik heb een keer met websockets gespeeld (vorig jaar) icm een of andere Java library met automagische fallback. Werkte op zich best wel goed. (alleen niet met websockets, want die waren uitgezet in alle browsers vanwege veiligheidsproblemen)