OnlineManager

Der OnlineManager verwaltet den Online-Status innerhalb von TanStack Query. Er kann verwendet werden, um die Standard-Ereignis-Listener zu ändern oder um den Online-Status manuell zu ändern.

Standardmäßig geht der onlineManager von einer aktiven Netzwerkverbindung aus und lauscht auf die online und offline Ereignisse des window Objekts, um Änderungen zu erkennen.

In früheren Versionen wurde navigator.onLine verwendet, um den Netzwerkstatus zu ermitteln. Dies funktioniert jedoch in Chromium-basierten Browsern nicht gut. Es gibt viele Probleme mit falschen Negativen, die dazu führen, dass Abfragen fälschlicherweise als offline markiert werden.

Um dies zu umgehen, beginnen wir nun immer mit online: true und lauschen nur auf online und offline Ereignisse, um den Status zu aktualisieren.

Dies sollte die Wahrscheinlichkeit von falschen Negativen verringern, kann aber zu falschen Positiven für Offline-Anwendungen führen, die über ServiceWorker geladen werden und auch ohne Internetverbindung funktionieren können.

Ihre verfügbaren Methoden sind

• setEventListener
• subscribe
• setOnline
• isOnline

setEventListener kann verwendet werden, um einen benutzerdefinierten Ereignis-Listener festzulegen

import NetInfo from '@react-native-community/netinfo'
import { onlineManager } from '@tanstack/react-query'

onlineManager.setEventListener((setOnline) => {
  return NetInfo.addEventListener((state) => {
    setOnline(!!state.isConnected)
  })
})

import NetInfo from '@react-native-community/netinfo'
import { onlineManager } from '@tanstack/react-query'

onlineManager.setEventListener((setOnline) => {
  return NetInfo.addEventListener((state) => {
    setOnline(!!state.isConnected)
  })
})

subscribe kann verwendet werden, um sich bei Änderungen des Online-Status anzumelden. Es gibt eine Funktion zum Abmelden zurück.

import { onlineManager } from '@tanstack/react-query'

const unsubscribe = onlineManager.subscribe((isOnline) => {
  console.log('isOnline', isOnline)
})

import { onlineManager } from '@tanstack/react-query'

const unsubscribe = onlineManager.subscribe((isOnline) => {
  console.log('isOnline', isOnline)
})

setOnline kann verwendet werden, um den Online-Status manuell festzulegen.

import { onlineManager } from '@tanstack/react-query'

// Set to online
onlineManager.setOnline(true)

// Set to offline
onlineManager.setOnline(false)

import { onlineManager } from '@tanstack/react-query'

// Set to online
onlineManager.setOnline(true)

// Set to offline
onlineManager.setOnline(false)

Optionen

• online: boolean

isOnline kann verwendet werden, um den aktuellen Online-Status abzurufen.

const isOnline = onlineManager.isOnline()

const isOnline = onlineManager.isOnline()