Erste Schritte mit socket.io in der Klassenbibliothek node.js_javascript

Einführung in Websocket und andere Reverse-Ajax-Technologien

In Echtzeit-Webanwendungen ist Reverse Ajax eine gängige Methode. Definition von Reverse Ajax:

Reverse Ajax (Reverse Ajax) ist im Wesentlichen ein Konzept, mit dem Daten vom Server an den Client gesendet werden können. Bei einer Standard-HTTP-Ajax-Anfrage kann Reverse Ajax eine Ajax-Anfrage auf bestimmte Weise simulieren. Auf diese Weise kann der Server Daten an den Server senden möglich. Client sendet Ereignisse (Kommunikation mit geringer Latenz).

Die Reverse-Ajax-Technologie hat hauptsächlich zwei Inhalte: Der eine besteht darin, dass der Server die TCP-Verbindung aufrechterhält, bis er Daten zum Senden an den Client hat (kann mithilfe von Schleifen und Schlaf implementiert werden), und der andere besteht darin, dass der Client über Programmierkenntnisse verfügt.

Websocket ist ein Standard von HTML5 und außerdem eine Anti-Ajax-Technologie.

Socket.io-Implementierung der umgekehrten AJAX-Technologie – Beispiel

Offizielle Einführung von socket.io:

Socket.IO zielt darauf ab, Echtzeit-Apps in jedem Browser und Mobilgerät zu ermöglichen und die Unterschiede zwischen den verschiedenen Transportmechanismen zu verwischen. Es ist 100 % sorglos in JavaScript, um Echtzeit-Konnektivität in jedem Browser bereitzustellen. IO wählt zur Laufzeit den leistungsfähigsten Transport aus, ohne dass dies Auswirkungen auf die API hat. WebSocket Adobe® Flash® Socket AJAX Long Polling AJAX Multipart Streaming Forever Iframe JSONP Polling

Einfach ausgedrückt ist socket.io eine auf NodeJS basierende Bibliothek, die verschiedene Reverse-Ajax-Technologien bündelt und die Schnittstelle vereinheitlicht. Zur Laufzeit wählt socket.io automatisch die entsprechende Reverse-Ajax-Technologie aus, um basierend auf den Bedingungen des Browsers mit dem socket.io-Server zu interagieren. Wenn Technologien wie Websocket Standards sind, dann ist socket.io eine Anwendung.

So installieren Sie es (der Autor verwendet Linux Mint 16):

Node.js installieren:

Kopieren Sie den Code Der Code lautet wie folgt:

sudo apt- get install nodejs

Geben Sie den Befehl nodejs ein, um in den Shell-Modus zu gelangen.

Installieren Sie npm:

Kopieren Sie den CodeDer Code lautet wie folgt:

sudo apt-get install npm

Installieren Sie socket.io:

Kopieren Sie den Code Der Code lautet wie folgt:

sudo npm install socket.io

Das Installationspaket wird im Verzeichnis ~/node_modules gespeichert, und der Client socket.io.js wird im Verzeichnis ~/node_modules/socket.io/node_modules/socket.io gespeichert -client/dist-Verzeichnis.

Socket.io-Beispiel

Die folgenden Beispiele stammen von der offiziellen Website und wurden entsprechend geändert.

Erstellen Sie zunächst den serverseitigen (serverseitigen) Code (Datei test.js):

Kopieren Sie den Code Der Der Code lautet wie folgt:

var io = require('socket.io').listen(8080);

io.sockets.on('connection', function (socket) {
socket.emit('news', { hello: 'world' });
socket.on('my other event' , function (data) {
console.log(data);
});
});

Der Server test.js ist an Port 8080 gebunden. Wenn ein Client eine Verbindung herstellt. Wann Der Server test.js läuft, der Server test.js sendet den News-Befehl an den Client und überträgt die Daten { hello: 'world' }; wenn der Server test.js den my other event-Befehl empfängt, ruft er den Rückruf auf Funktion function (data) { console.log(data);} zum Verarbeiten der empfangenen Datendaten.

Der Autor hat einen Nginx-Server erstellt, der Port 80 verwendet und das Web-Stammverzeichnis /usr/share/nginx/html ist. Kopieren Sie socket.io.min.js unter ~/node_modules/socket.io/node_modules/socket.io-client/dist in das Web-Root-Verzeichnis und erstellen Sie die Datei index.php im Web-Root-Verzeichnis (als Client). Der Inhalt lautet wie folgt:

Code kopieren Der Code lautet wie folgt:

< ;head>



<script><BR> var socket = io.connect('http://localhost:8080');<BR> socket.on('news', function (data) {<BR> console.log(data) ;<BR> console .log(data["hello"]);<BR> socket.emit('my other event', { my: 'data' });<BR> });<BR></ script><BR> <P></script>