HTML5 WebSockets ?!?

Hallo erst mal…

ich habe mich in letzter Zeit ein bisschen mit HTML5 und WebSockets auseinandergesetzt und jetzt bin ich zu der Frage gekommen ob man für das benutzen von Websockets eigentlich unbedingt einen SERVER benötigt oder ob ein VIRTUAL SERVER reichen würde. Habe bis jetzt immer nur kleine Beispiele mit XAMPP gesehen.

Hat sich einer schon mal ein bisschen mit dem Thema befasst und kann mir ein bisschen auf die Sprünge helfen was ich genau für Möglichkeiten habe ein SERVER / CLIENT Programm auf die Beine zu stellen ?

Ein kleiner Link oder Schubser in die Richtige Richtung würde mir auch schon helfen. :smiley:
Werde mich in jedem Fall die nächsten 2 Wochen mit dem Thema intensiv auseinandersetzen (Urlaub).

Freue mich auf Antworten. ^^

Ich hatte bisher diesen Ausdruck noch nie gehört oder aber ignoriert, aber was ich nun unter nachlesen konnte WebSocket-Implementierung mit PHP, fand ich tierisch interessant. Soweit ich das sehe nimmt das normale Socket-Verbindungen, neu ist also nur, dass dies nun auch innerhalb eines Browsers ohne beispielsweise unter Windows irgendwelche COM-Objekte einzubinden (mit all den Problemen). Somit kann der Server aus meiner Sicht mehr oder weniger jeder Computer sein, der TCP/IP kann und eine API für Sockets bereit stellt.

Mein Eindruck ist, dass das in einigen Bereichen das xmlHTTPRequest Object ablösen wird, insbesondere dort, wo ein Hintergrund-Timer mit Polling Funktionen gestartet werden musste. Auf jeden Fall ein sehr interessantes Thema.

Hey danke NetAktiv ich werde mir den Link gleich mal angucken. Danke schon mal =)

Edit :

Ach so okay also soweit ich das jetzt verstanden habe kann ich einen WebSocket auch mit PhP aufrufen.
Da steht jedoch das ich einen Parameter für die Protokollart bei dem Befehl socket_create angeben muss.

„Da die WebSockets auf dem TCP/IP(-Protokoll) basieren, wählen wir SOL_TCP als Protokoll und AF_INET als Protokollfamilie“

Kann man da auch UDP nehmen ? Oder funktioniert das nicht.

Und um nen eigenen Server oder XAMPP kommt man wohl auch nicht rum. Werde wohl von meinem „Virtual Server Managed XL 5.0“ auf einen „Virtual Server Windows XXL 4.0“ oder „Virtual Server Linux XXL 4.0“ (hosteurope.de) wechseln müssen.

Also wenn du echtes Netzwerk machen willst und nicht nur über den Loopback dann schon, aber nur zum Testen und Entwickeln sehe ich das nicht unbedingt notwendig an. Ich teste manchmal echtes Netzwerk sogar, indem ich meinen eigenen PC über meine dyndns.org Adresse anspreche. Dann gehen die Pakete zumindest bis zum meinem Router, der dann von außen gesehen die IP meiner xxx.dyndns.org subdomain hat. Ansonsten habe ich alle Komponenten auf einem PC. Auf VM weiche ich manchmal aus, wenn ich ältere Versionen von IE testen will.

Hier herrscht ein bisschen Namensverwirrung.

Sockets sind die Grundlagen der Netzwerkprogrammierung. Sockets brauchst du für alles, was mit der Kommmunikation im Internet zu tun hat. Um einen Server zu programmieren, einen Browser, sowas wie ICQ usw. usf.

Websocket ist lediglich ein Marketingbegriff dafür, dass die Kommunikation von einem Client aus abläuft.

Ein Virtual Server ist ebenfalls ein Marketingbezeichnung für eine technische Besonderheit, dass du einen Server so kinfigurieren kannst, als ob es mehrere sind.

Websockets ist also einfach ein Netzprogrammierschnittstelle im Browser, mit der du zu jedem Server eine TCP Verbindung aufbauen kannst, der im Netzwerk zu Verfügung steht.

Das was bei Wikipedia steht ist verwirrend, bzw. falsch. Eine Websocket implementierung in PHP ist lediglich eine Wrapper, der die W3C API imitiert. PHP und auch alle anderen Programmiersprachen, können ganz normal über Sockets kommunizieren und brauchen diese Schnittstelle gar nicht.

Wie gesagt, das sind alles Marketingbegriffe. Ein Server reicht, ob deine Domain dabei auf einem echten Server, einen virtuellen oder einem shared server liegt ist unerheblich.

Websockets sind nur für TCP konzipiert. Aber in PHP kannst du natürlich auch mittels UDP kommunizieren, dann brauchst du aber nicht den Websocketwrapper. Wie gesagt das ist nur eine Imitation der Schnittstelle, die eigentlich für Browser gedacht ist.

Danke Struppi für die Aufklärung. =)

Anscheinend ist da garnicht so viel neues drann an den WebSockets. Oder haben die doch einen eintscheidenden vorteil?
So wie ich das jetzt verstanden habe ging das ja jetzt alles auch schon vorher.

Nein, das neue ist, dass du im Browser über JS Sockets ansprechen kannst, das ging vorher nicht und nur über mit Java.

Na ja, Browser konnten das vorher eben nicht (bzw. nur über Plug-ins wie Flash und Java, ja). Da gab es nur Ajax, also zustandslose, „einseitige“ HTTP-Requests. Eine „echte“ Socketverbindung ist im Normalfall bidirektional.

Der Unterschied ist gewaltig. Stell dir beispielsweise ein Online-Brettspiel (wo ich NetAktivs Avatar sehe ;)) vor, in dem im Browser zwei Spieler gegeneinander antreten können. Das Spiel soll mit HTML/JS und einer serverseitigen Komponente zur Datenhaltung programmiert sein (also kein Flash, kein Java-Applet, …). Das Problem ist, den jeweiligen Spielern mitzuteilen, dass der jeweils andere Spieler einen Zug ausgeführt hat. Ohne Sockets geht das nur mit Ajax, also – NetAktiv hat’s glaube ich schon angesprochen – durch wiederholte HTTP-Anfragen an den Server: „Ist was Neues für mich da?“ Die Antwort darauf dürfte meist „Nein.“ lauten, und der Request verbraucht nur unnötig Bandbreite. Außerdem hast du eine gewisse Wartezeit drin, da du praktischerweise nur alle meinetwegen 10 Sekunden einen Request absetzt. Das heißt, du bekommst im Schnitt erst nach 5 Sekunden (+ Requestdauer) mit, dass der Gegner gezogen hat.

Bei einer Socketverbindung kann der Server selbsttätig Daten an die Clients (also die Spieler) senden. Da fallen die „Hast du was für mich?“-Anfragen und der gesamte HTTP-Overhead weg (das ist bei sowas ein signifikanter Anteil, ich sage mal 95 % oder mehr). Außerdem geschieht die Aktualisierung praktisch in Echtzeit beziehungsweise hast du dann im Grunde sowas wie einen „Ping“ wie bei einem Online-Spiel oder so. (Und genau sowas wird kommen, nativ in HTML/JS.)

Ajax war immer in mancher Hinsicht eine „Krücke“, da HTTP eben zustandslos ist.

http://imgs.xkcd.com/comics/server_attention_span.png

(xkcd)

Edit: Übrigens 'ne ganz interessante Frage, ob man die Serverkomponente für sowas in PHP schreiben wird… :wink: Da muss ich mich auch mal einlesen.

Das habe ich aber anders verstanden. Klar sind es nur normale ‚Sockets‘, aber das Erstellen oder Nutzen derselben scheint doch nun durch die Browser unterstützt zu werden (so wie heute schon xmlHTTPRequest). Und damit erreicht man eine neue Qualität, nämlich Socket-Kommunikation im Browser. Das wäre das gleiche, wenn man heute zu dem Entschluss käme, vom Browser her auf die Festplatte zugreifen zu dürfen (klar, wird man aus Sicherheitsgründen nicht machen). Klar gibt es heute schon Festplattenzugriff und man kann es auch tun (zumindest auf Windows Clients mit Browsern mit X-ActiveUnterstützung in Trusted Sites), aber es ist nicht Teil der HTML Spezifikation. Ebenso kann ich heute unter den gleichen Bedingungen schon eine DLL einbinden und Socket-Kommunikation im Browser integrieren, aber es ist noch nicht Teil von HTML vor 5.

Ah okay…

Jetzt hab ich zumindest schon mal verstanden was WebSocket genau macht. ( btw. nice Comic [B]mermshaus[/B] :D)

Hab gerade einen ziemlich dicken Kopf wegen zu vielen Infos. ^^
Werde später mal versuchen ein kleines Server/Client Programm zu schreiben.

Hier noch ein wie ich finde sehr interessanter Link, wen es interessiert → Socket.IO

Das bestreite ich ja auch nicht. Aber es bleibt trotzdem einfach eine Schnittstelle zu Sockets, die API wird Websocket gennant. Es ist aber nicht etwas grundsätzlich Neues, zumal der Browser an sich sowieso über Sockets kommuniziert, nur gab es dafür bisher keine Schnittstelle.

Im Wikipedia Artikel klingt das so, als ob ihr eine völlig neue Variante der Netzwerkkommunikation vorliegen würde, die von vielen Programmiersprachen umgesetzt wird, dabei sind das lediglich Bibliotheken, die nur die API nachbauen.

Achso, den habe ich nicht gelesen. Wäre ja auch verwunderlich, wenn man etwas völlig neues brauchte, wo man doch mit normalen Anwendungen heute eigentlich alles erreicht, was man braucht.

Vielleicht auf einen Satz gebracht: Webseiten sind mit Websockets nicht mehr darauf beschränkt, Daten über das HTTP-Protokoll senden/empfangen zu müssen.

Erster Schritt…

Nochmal hallo an alle.
Ich habe jetzt mit Hilfe von Xampp ein Beispiel zum laufen gebracht.

Der Code :
[HTML]


<title>WebSockets Client</title>  
  
<style type="text/css">
<!--
      body {  
    font-family:Arial, Helvetica, sans-serif;  
}  
#container{  
    border:5px solid grey;  
    width:800px;  
    margin:0 auto;  
    padding:10px;  
}  
#chatLog{  
    padding:5px;  
    border:1px solid black;  
}  
#chatLog p {  
    margin:0;  
}  
.event {  
    color:#999;  
}  
.warning{  
    font-weight:bold;  
    color:#CCC;  
}  
-->
</style>

<script language="JavaScript">
<!--
      $(document).ready(function() {  
  
  if(!("WebSocket" in window)){  
  $('#chatLog, input, button, #examples').fadeOut("fast");  
  $('<p>Oh no, you need a browser that supports WebSockets. How about <a href="http://www.google.com/chrome">Google Chrome</a>?</p>').appendTo('#container');  
  }else{  
      //The user has WebSockets  
  
      connect();  
  
      function connect(){  
          var socket;  
          var host = "ws://localhost:123456/server.php";  
  
          try{  
              var socket = new WebSocket(host);  
  
              message('<p class="event">Socket Status: '+socket.readyState);  
  
              socket.onopen = function(){  
                 message('<p class="event">Socket Status: '+socket.readyState+' (open)');  
              }  
  
              socket.onmessage = function(msg){  
                 message('<p class="message">Received: '+msg.data);  
              }  
  
              socket.onclose = function(){  
                message('<p class="event">Socket Status: '+socket.readyState+' (Closed)');  
              }           
  
          } catch(exception){  
             message('<p>Error'+exception);  
          }  
  
          function send(){  
              var text = $('#text').val();  
  
              if(text==""){  
                  message('<p class="warning">Please enter a message');  
                  return ;  
              }  
              try{  
                  socket.send(text);  
                  message('<p class="event">Sent: '+text)  
  
              } catch(exception){  
                 message('<p class="warning">');  
              }  
              $('#text').val("");  
          }  
  
          function message(msg){  
            $('#chatLog').append(msg+'</p>');  
          }  
  
          $('#text').keypress(function(event) {  
              if (event.keyCode == '13') {  
                send();  
              }  
          });     
  
          $('#disconnect').click(function(){  
             socket.close();  
          });  
  
      }//End connect  
  
  }//End else  
  
});  
//-->
</script>

</head>  
<body>  
<div id="wrapper">  
  
    <div id="container">  
  
        <h1>WebSockets Client</h1>  
  
        <div id="chatLog">  
  
        </div><!-- #chatLog -->  
        <p id="examples">e.g. try 'hi', 'name', 'age', 'today'</p>  
  
        <input id="text" type="text" />  
        <button id="disconnect">Disconnect</button>  
  
    </div><!-- #container -->  
  
</div>  
</body>  
</html>​  

[/HTML]

Von meinem eigenen Rechner (localhost) aus klappt das soweit auch ganz gut.
Von einem anderen Rechner aus baut sich zwar die Webseite auf, jedoch verbindet sich der Client nicht mit dem server.
„Socket Status: 3 (Closed)“

Meine Frage ist jetzt wie ich das ändern kann. Was habe ich falsch gemacht ?

Kann es sein das es am „localhost“ in folgendem befehl handelt ?
→ var host = „ws://localhost:123456/server.php“;

Der Port und der Pfad zu’r server.php stimmen.

Hoffe mir kann einer helfen. Stecke da grad bissel fest.

EDIT :

Hab meinen Fehler gefunden. =)
Es lag an meiner Server.php !!
Dort hatte ich anstatt der lokalen IP „localhost“ stehen und das gleiche bei dem clienten.
So kann es natürlich nicht functionieren. ( Brett vorm Kopf :oops: )

Habe noch einen Interessanten Beitrag zum Thema Websockets gefunden.

PHP WebSocket Server | siriux.net

viel Spass dabei…