NGINX und NGINX Plus mit Node.js und Socket.IO sowie der WebSocket-API verwenden

Patrick Nommensen

In diesem Beitrag geht es um die Verwendung von NGINX und NGINX Plus mit Node.js und Socket.IO. Unser Beitrag über die Entwicklung von Echtzeit-Webanwendungen mit WebSocket und NGINX erfreut sich großer Beliebtheit. Daher stellen wir in diesem Beitrag weitere Dokumentationen und Best Practices für die Verwendung von Socket.IO vor.

Warum NGINX mit Node.js und Socket.IO verwenden?

Socket.IO ist eine WebSocket-API, die mit dem Aufkommen von Node.js-Anwendungen große Beliebtheit erlangt hat. Die API ist weithin bekannt, da sie die Entwicklung von Echtzeitanwendungen wie Onlinespielen oder Chats vereinfacht. NGINX 1.3.13 und höher sowie alle Versionen von NGINX Plus unterstützen das Proxying von WebSocket-Verbindungen, sodass Sie Socket.IO nutzen können. Das WebSocket-Protokoll ermöglicht eine Vollduplex- bzw. bidirektionale Kommunikation über eine einzige TCP-Verbindung.

In Produktionsumgebungen ausgeführte Anwendungen müssen in der Regel Port 80 (HTTP), Port 443 (HTTPS) oder beide verwenden. Dies kann eine Herausforderung darstellen, wenn mehrere Komponenten Ihrer Anwendung mit dem Benutzer interagieren oder Sie einen Webserver an Port 80 verwenden, um andere Ressourcen bereitzustellen. Daher ist es erforderlich, Anfragen per Proxy an den Socket.IO-Server weiterzuleiten. NGINX ist dafür die beste Lösung. Unabhängig davon, ob Sie eine einzelne Instanz Ihrer Backend-Anwendung oder Hunderte davon betreiben, kann NGINX bei der Verwendung mehrerer Knoten auch die Last auf Ihre Upstream-Server verteilen.

Socket.IO-Konfiguration

Um Node.js zu installieren, laden Sie die passende Distribution herunter (oder installieren Sie es mit einem Paketmanager). Führen Sie den Befehl „npm install socket.io“ aus, um Socket.IO zu installieren.

Für dieses Beispiel gehen wir davon aus, dass der Socket.IO-Server für Ihre Echtzeitanwendung auf Port 5000 ausgeführt wird. Im Folgenden finden Sie eine Vorlage für eine server.js-Datei einer Node-Anwendung. Dabei handelt es sich um ein einfaches Programm, das als Server fungiert und eingehende Anfragen an den entsprechenden Port weiterleitet, auf dem der Socket.IO-Server ausgeführt wird.

var io = require('socket.io').listen(5000); 
io.sockets.on('connection', function (socket) {
  socket.on('set nickname', function (name) {
    socket.set('nickname', name, function () {
      socket.emit('ready');
    });
  });
 
  socket.on('msg', function () {
    socket.get('nickname', function (err, name) {
      console.log('Chat message by ', name);
    });
  });
});

Fügen Sie JavaScript-Code wie den folgenden in die Datei ein, die an Ihren Client ausgeliefert wird, zum Beispiel index.html. In diesem Beispiel wird eine Verbindung zu Ihrer Anwendung angefordert, um einen WebSocket mit dem Browser Ihres Benutzers herzustellen.

<script src="/socket.io/socket.io.js"></script>
<script>
     var socket = io(); // your initialization code here.
</script>

NGINX-Konfiguration

Upstream-Deklaration

NGINX und NGINX Plus können die Last verteilen und Benutzersitzungen auf mehrere Knoten verteilen, wenn Ihre Anwendung über mehrere Instanzen verfügt. Fügen Sie im http-Kontext Ihrer NGINX- oder NGINX Plus-Konfiguration einen upstream-Block ein, um die Knoten in einer Upstream-Gruppe zu definieren.

Wie im folgenden Beispiel gezeigt, können Sie den Parameter weight in eine server-Direktive aufnehmen, um den Anteil des an diesen Server weitergeleiteten Datenverkehrs festzulegen. Hier empfängt srv1.app.com fünfmal mehr Sitzungen als die anderen Server. NGINX Plus erweitert die Reverse-Proxy-Funktionen von NGINX um verbesserte Load-Balancing-Methoden sowie um Sitzungspersistenz, Zustandsprüfungen, erweiterte Statusberichte und die dynamische Neukonfiguration von Servergruppen mit Lastverteilung.

# in the http{} configuration block
upstream socket_nodes {
    ip_hash;
    server srv1.app.com:5000 weight=5;
    server srv2.app.com:5000;
    server srv3.app.com:5000;
    server srv4.app.com:5000;
}

Konfiguration des virtuellen Hosts

Nachdem die Upstream-Servergruppe definiert wurde, muss ein virtueller Server konfiguriert werden, der den Datenverkehr an sie weiterleitet. Fügen Sie mindestens die Direktive proxy_pass ein und geben Sie den Namen der Upstream-Gruppe an. Da das WebSocket-Protokoll den mit HTTP/1.1 eingeführten Header Upgrade verwendet, fügen wir die Direktive proxy_http_version ein.

server {
    server_name app.domain.com;
    location / {
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $host;
        proxy_pass http://socket_nodes;
    }
}

Was ist mit statischen Dateien?

Zur Bereitstellung statischer Dateien können Sie NGINX Anfragen an eine vorgeschaltete Node.js-Instanz weiterleiten lassen. In den meisten Fällen ist es jedoch effizienter, sie direkt von NGINX ausliefern zu lassen.

In Kombination mit der server_name-Direktive im obigen server-Block weist der folgende location-Block NGINX an, auf Clientanfragen nach Inhalten unter http://app.domain.com/assets/ zu antworten, indem diese aus dem lokalen Verzeichnis /path/to/assets bereitgestellt werden. Sie können die Verarbeitung statischer Dateien weiter optimieren oder Ihren Anforderungen entsprechende Einstellungen für den Cache-Ablauf festlegen.

location /assets {
    alias /path/to/assets;
    access_log off;
    expires max;
}

Fehlerbehebung

Wenn Sie die folgende Fehlermeldung erhalten, verwenden Sie wahrscheinlich eine NGINX-Version vor 1.3. WebSocket wird ab NGINX 1.3.13 unterstützt.

WebSocket connection to '...' failed: Error during WebSocket handshake: 'Connection' header value is not 'Upgrade': keep-alive socket.io.js:2371

Weiterführende Literatur

• NGINX als WebSocket-Proxy
• Funktionsvergleich von NGINX und NGINX Plus
• Technische Spezifikationen von NGINX Plus

Wenn Sie NGINX Plus ausprobieren möchten, starten Sie noch heute Ihre kostenlose 30-Tage-Testversion oder kontaktieren Sie uns, um Ihre Anwendungsfälle zu besprechen.

Über den Autor

Patrick Nommensen

Weitere Blogbeiträge von Patrick Nommensen