Network Information API
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Hinweis: Diese Funktion ist in Web Workers verfügbar.
Die Network Information API bietet Informationen über die Verbindung des Systems in Bezug auf den allgemeinen Verbindungstyp (z.B. 'wifi', 'cellular', etc.). Dies kann verwendet werden, um basierend auf der Verbindung des Benutzers hochauflösende oder niedrigauflösende Inhalte auszuwählen.
Die Schnittstelle besteht aus einem einzigen NetworkInformation-Objekt, welches durch die Navigator.connection-Eigenschaft oder die WorkerNavigator.connection-Eigenschaft zurückgegeben wird.
Schnittstellen
NetworkInformation-
Bietet Informationen über die Verbindung, die ein Gerät zur Kommunikation mit dem Netzwerk verwendet, und ermöglicht es Skripten, benachrichtigt zu werden, wenn sich der Verbindungstyp ändert. Die
NetworkInformation-Schnittstelle kann nicht instanziiert werden. Sie wird stattdessen über dieNavigator-Schnittstelle oder dieWorkerNavigator-Schnittstelle aufgerufen.
Erweiterungen zu anderen Schnittstellen
-
Gibt ein
NetworkInformation-Objekt zurück, das Informationen über die Netzwerkverbindung eines Geräts enthält. -
Bietet ein
NetworkInformation-Objekt, das Informationen über die Netzwerkverbindung eines Geräts enthält.
Beispiele
Verbindungänderungen erkennen
Dieses Beispiel überwacht Änderungen an der Verbindung des Benutzers.
let type = navigator.connection.effectiveType;
function updateConnectionStatus() {
console.log(
`Connection type changed from ${type} to ${navigator.connection.effectiveType}`,
);
type = navigator.connection.effectiveType;
}
navigator.connection.addEventListener("change", updateConnectionStatus);
Große Ressourcen vorladen
Das Verbindungsobjekt ist nützlich, um zu entscheiden, ob Ressourcen vorab geladen werden sollen, die viel Bandbreite oder Speicher benötigen. Dieses Beispiel würde kurz nach dem Laden der Seite aufgerufen werden, um eine Verbindung zu überprüfen, bei der das Vorladen eines Videos möglicherweise nicht wünschenswert ist. Wenn eine Mobilfunkverbindung erkannt wird, wird die preloadVideo-Flag auf false gesetzt. Zur Vereinfachung und Klarheit testet dieses Beispiel nur für einen Verbindungstyp. Ein realer Anwendungsfall würde wahrscheinlich eine Switch-Anweisung oder eine andere Methode verwenden, um alle möglichen Werte von NetworkInformation.type zu überprüfen. Unabhängig vom type-Wert können Sie eine Schätzung der Verbindungsgeschwindigkeit über die NetworkInformation.effectiveType-Eigenschaft erhalten.
let preloadVideo = true;
const connection = navigator.connection;
if (connection) {
if (connection.effectiveType === "slow-2g") {
preloadVideo = false;
}
}
Spezifikationen
| Specification |
|---|
| Network Information API |