Signatur
Beschreibung
Die Eigenschaft onLine des WorkerNavigator-Objekts gibt den Netzwerkstatus des Browsers zurück. Sie entspricht navigator.onLine im Hauptthread, ist aber in Web Workern, Shared Workern und Service Workern über self.navigator.onLine (bzw. einfach navigator.onLine) erreichbar.
Der Wert ist true, wenn der Browser annimmt, dass eine Netzwerkverbindung besteht, und false, wenn er sicher offline ist. Ändert sich der Status, werden im globalen Gültigkeitsbereich des Workers die Events online und offline ausgelöst. Beide lassen sich per self.addEventListener("online", …) oder über die Eigenschaften self.ononline bzw. self.onoffline abonnieren.
Typische Einsatzgebiete sind Worker, die im Hintergrund Daten synchronisieren oder Anfragen in eine Warteschlange stellen: Ist der Browser offline, werden Anfragen zwischengespeichert und nach dem Wiederherstellen der Verbindung abgeschickt. Wichtig: true heißt nur, dass eine Netzwerkschnittstelle aktiv ist – nicht, dass das Internet oder dein Server tatsächlich erreichbar ist.
Rückgabewert
true, wenn der Browser als online gilt, sonst false. Die Eigenschaft ist schreibgeschützt.Beispiele
Status im Dedicated Worker abfragen
// worker.js
const status = navigator.onLine ? 'online' : 'offline';
postMessage({ type: 'network-status', status });
// main.js
const worker = new Worker('worker.js');
worker.addEventListener('message', (event) => {
console.log('Worker meldet:', event.data.status);
});
Auf Statuswechsel im Worker reagieren
// worker.js
const meldeStatus = () => {
postMessage({ online: navigator.onLine });
};
// Variante 1: addEventListener
self.addEventListener('online', meldeStatus);
self.addEventListener('offline', meldeStatus);
// Variante 2: on-Properties
// self.ononline = meldeStatus;
// self.onoffline = meldeStatus;
meldeStatus(); // Anfangszustand senden
Warteschlange für Uploads im Worker
// sync-worker.js
const warteschlange = [];
const senden = async (daten) => {
await fetch('/api/messwerte', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(daten)
});
};
const abarbeiten = async () => {
while (navigator.onLine && warteschlange.length > 0) {
const eintrag = warteschlange[0];
try {
await senden(eintrag);
warteschlange.shift();
} catch (fehler) {
// Server nicht erreichbar, obwohl onLine === true
console.warn('Senden fehlgeschlagen, später erneut:', fehler.message);
break;
}
}
};
self.addEventListener('message', (event) => {
warteschlange.push(event.data);
abarbeiten();
});
self.addEventListener('online', abarbeiten);
// Wichtig · Fallstricke
- Kein Garant für Erreichbarkeit:
truebedeutet nur, dass eine Netzwerkverbindung (z. B. LAN, WLAN, virtueller Adapter) besteht. Captive Portals, DNS-Probleme oder ein ausgefallener Server werden nicht erkannt. Fehler vonfetch()daher immer zusätzlich behandeln. - Nur
falseist verlässlich: Meldet der Browser offline, ist er meist tatsächlich offline. Virtuelle Netzwerkadapter (VPN, Docker, VirtualBox) können dagegen fälschlichtrueergeben. - Der Offline-Modus der Entwicklerwerkzeuge setzt den Wert in Chrome und Firefox auf
false; in Firefox löste früher auch „Offline arbeiten“ den Wechsel aus. - Die Events
online/offlinewerden am globalen Worker-Objekt (self) ausgelöst, nicht annavigator. - Kompatibilität: In allen modernen Browsern in Dedicated, Shared und Service Workern verfügbar. Sehr alte Browserversionen unterstützten
onLinein Workern teils nicht – bei Bedarf mit'onLine' in navigatorprüfen.