1. Einführung
Zunächst die offizielle Website von Socket.io: http://socket.io
Die offizielle Website ist sehr präzise und es gibt sogar keine API -Dokumentation, nur eine einfache "zum Verwenden" zu verwenden. Denn Socket.io ist so einfach und einfach zu bedienen wie die offizielle Website.
Was ist Socket.io? Socket.io ist eine WebSocket-Bibliothek, die clientseitige JS und serverseitige NodeJs enthält. Ziel ist es, Echtzeitanwendungen zu erstellen, die auf verschiedenen Browsern und mobilen Geräten verwendet werden können. Es wird automatisch den besten Weg wählen, um die Echtzeit-Netzwerkanwendung basierend auf dem Browser aus verschiedenen Methoden wie WebSocket, Ajax Long Polling, Iframe-Streaming usw. zu realisieren, was sehr bequem und benutzerfreundlich ist. Die unterstützten Browser sind so niedrig wie die IE 5.5, was die meisten Bedürfnisse erfüllen sollte.
2. Installation und Bereitstellung
2.1 Installation
Zunächst ist die Installation in der node.js -Umgebung sehr einfach, nur ein Satz:
Die Codekopie lautet wie folgt:
npm install Socket.io
2.2 Kombination aus Express, um einen Server zu erstellen
Express ist ein kleiner Node.JS -Webanwendungs -Framework, der häufig beim Erstellen von HTTP -Servern verwendet wird. Daher wird er direkt mit Socket.io und Express als Beispiele erklärt.
Die Codekopie lautet wie folgt:
var express = require ('express')
, app = express ()
, Server = Request ('http'). createServer (App)
, io = fordert ('socket.io'). Hören (Server);
server.Listen (3001);
Wenn Sie Express nicht verwenden
3.. Grundnutzungsmethode
Es ist hauptsächlich in zwei Code-Teile unterteilt: serverseitig und clientseitig, die beide sehr einfach sind.
Server (App.js):
Die Codekopie lautet wie folgt:
// Verbinde den obigen Code
app.get ('/', Funktion (req, res) {
res.sendfile (__ DirName + '/index.html');});
io.sockets.on ('Verbindung', Funktion (Socket) {
Socket.Emit ('News', {Hello: 'World'});
Socket.on ('Andere Ereignis', Funktion (Daten) {
console.log (Daten);
});
});
Zunächst akzeptiert die Funktion io.sockets.on die Zeichenfolge "Verbindung" als das Ereignis, in dem der Client die Verbindung initiiert. Wenn die Verbindung erfolgreich ist, wird die Rückruffunktion mit Socket -Parametern aufgerufen. Wenn wir Socket.io verwenden, handeln wir im Grunde genommen Benutzeranforderungen in dieser Rückruffunktion.
Das Wichtigste an Socket ist auszugeben und weiter. Das erstere gibt ein Ereignis (Ausgaben) ein (der Ereignisname wird durch eine Zeichenfolge dargestellt). Der Ereignisname kann angepasst werden, und es gibt einige Standard -Ereignisnamen, gefolgt von einem Objekt, das den an den Socket gesendeten Inhalt angibt. Letzterer erhält ein Ereignis (der Ereignisname wird durch eine Zeichenfolge dargestellt), gefolgt von einer Rückruffunktion, die den Ereignisanruf empfängt, wobei Daten die empfangenen Daten sind.
Im obigen Beispiel haben wir das Nachrichtenereignis gesendet und das andere Ereignisereignis erhalten, sodass der Kunde entsprechende Empfangsempfänger und Senden von Ereignissen haben sollte. Ja, der Clientcode ist genau das Gegenteil und sehr ähnlich wie der Server.
Client (Client.js)
Die Codekopie lautet wie folgt:
<script src = "/socket.io/socket.io.js"> </script>
<Script>
var socket = io.connect ('http: // localhost');
Socket.on ('News', Funktion (Daten) {
console.log (Daten);
Socket.Emit ('Andere Ereignis', {my: 'data'});
});
</script>
Es gibt zwei Dinge zu beachten: Der Pfad von Socket.io.js muss korrekt geschrieben werden. Diese JS -Datei wird tatsächlich im Ordner node_modules auf der Serverseite platziert. Es wird umgeleitet, wenn diese Datei angefordert wird. Seien Sie daher nicht überrascht, dass diese Datei auf der Serverseite nicht vorhanden ist, sondern warum sie immer noch normal funktioniert. Natürlich können Sie die serverseitige Socket.io.js-Datei in lokal kopieren und sie zu einer clientseitigen JS-Datei machen, sodass Sie diese JS-Datei nicht jedes Mal vom Knotenserver anfordern müssen, was die Stabilität verbessert. Der zweite Punkt ist die Verwendung von var socket = io.connect ('Website -Adresse oder IP'). Um das Socket -Objekt zu erhalten, können Sie mit Socket Ereignisse senden und empfangen. In Bezug auf die Ereignisverarbeitung bedeutet der oben genannte Code, dass nach Erhalt des "Nachrichten" -Events die empfangenen Daten gedruckt und das "andere Ereignis" -Ereignis an den Server gesendet wird.
HINWEIS: Der integrierte Standard-Ereignisname, z. B. "Disconnect", bedeutet, dass die Clientverbindung getrennt ist.
4. Andere gemeinsame APIs
1). Sendung an alle Kunden: Socket.Broadcast.Emit ('Broadcast Message');
2). Betreten Sie einen Raum (sehr einfach zu bedienen! Es entspricht einem Namespace, der in einen bestimmten Raum übertragen werden kann, ohne Kunden in anderen Räumen oder nicht im Raum zu betreffen): Socket.Join ('dein Zimmername');
3). Broadcast -Nachricht an einen Raum (der Absender kann die Nachricht nicht empfangen): Socket.Broadcast.to ('dein Zimmername'). Emit ('Broadcast Room Message');
4). Broadcast -Nachrichten an einen Raum (einschließlich Absender kann Nachrichten empfangen) (diese API gehört zu IO.Sockets): io.sockets.in ('ein anderer Raumname').
5). Force WebSocket -Kommunikation: (Client) socket.send ('hi'), (Server) Verwenden Sie Socket.on ('Nachricht', Funktion (Daten) {}), um zu empfangen.
5. Erstellen Sie einen Chatraum mit Socket.io
Schließlich beenden wir diesen Artikel mit einem einfachen Beispiel. Die Verwendung von Socket.io zum Erstellen eines Chatraums besteht in etwa 50 Codezeilen, und der Echtzeit-Chat-Effekt ist ebenfalls sehr gut. Die folgenden Schlüsselcodes werden veröffentlicht:
Server (Socketchat.js)
Die Codekopie lautet wie folgt:
// Ein Wörterbuch für die Clientverbindung, wenn ein Client eine Verbindung zum Server herstellt,
// Ein eindeutiger Socketid wird generiert, und das Wörterbuch wird die Zuordnung von SocketID auf Benutzerinformationen (Spitzname usw.) erhalten
var ConnectionList = {};
exports.Startchat = function (io) {
io.sockets.on ('Verbindung', Funktion (Socket) {
// Socketid und Benutzernamen bei der Client -Verbindung speichern
var socketId = socket.id;
ConnectionList [SocketID] = {
Sockel: Sockel
};
// Der Benutzer betritt das Chatroom -Ereignis und sendet seinen Benutzernamen an andere Online -Benutzer
socket.on ('join', function (data) {
Socket.Broadcast.emit ('Broadcast_join', Data);
ConnectionList [SocketId] .username = data.username;
});
// Der Benutzer verlässt den Vorfall mit dem Chatraum und sendet seine Abkehr zu anderen Online -Benutzern
socket.on ('tricnect', function () {
if (ConnectionList [SocketId] .username) {
Socket.Broadcast.emit ('Broadcast_quit', {
Benutzername: ConnectionList [SocketId] .Unername
});
}
ConnectionList löschen [SocketId];
});
// Benutzer Sprachvorfall, übertragen Sie den Inhalt ihrer Sprache an andere Online -Benutzer
Socket.on ('Say', Funktion (Daten) {
Socket.Broadcast.emit ('Broadcast_Say', {{
Benutzername: ConnectionList [SocketId] .Unername,
Text: Data.text
});
});
})
};
Client (Socketchatclient.js)
Die Codekopie lautet wie folgt:
var socket = io.connect ('http: // localhost');
// Senden Sie nach der Verbindung zum Server sofort ein "Join" -Event und teilen Sie anderen Ihren Benutzernamen mit
Socket.Emit ('Join', {
Benutzername: 'Benutzername hehe'
});
// Nach Erhalt der Ausstrahlung des Chatraums wird die Nachricht angezeigt
Socket.on ('Broadcast_join', Funktion (Daten) {
console.log (data.username + 'zum Chatraum hinzugefügt');
});
// Nach Erhalt der Sendung, die den Chatraum verlassen hat, wird die Nachricht angezeigt
Socket.on ('Broadcast_quit', Funktion (Daten) {
console.log (data.username + 'verlassen den Chatraum');
});
// Nach Erhalt einer Nachricht von jemand anderem wird die Nachricht angezeigt
Socket.on ('Broadcast_say', Funktion (Daten) {
console.log (data.username + 'sagen:' + data.text);
});
// Hier gehen wir davon aus, dass es ein Textfeld Textbereich und eine Schaltfläche Senden gibt.
// Ereignis mit JQuery binden
$ ('. Btn-send'). Click (Funktion (e) {
// Text des Textfelds erhalten
var text = $ ('textarea'). val ();
// Senden Sie ein Say -Ereignis und der Server sendet es, wenn es es empfängt.
Socket.Emit ('Say', {
Benutzername: 'Benutzername hehe'
Text: Text
});
});
Dies ist eine einfache Chatroom -Demo, die Sie so erweitern können, wie Sie möchten. Socket.io ist im Grunde die Einreichung und Empfangsverarbeitung verschiedener Veranstaltungen, und die Idee ist sehr einfach.