본문으로 건너뛰기

OnlineManager

OnlineManager는 TanStack Query 내의 온라인 상태를 관리합니다. 기본 이벤트 리스너를 변경하거나 온라인 상태를 수동으로 변경하는 데 사용할 수 있습니다.

기본적으로 onlineManager는 네트워크 연결이 활성 상태라고 가정하며, 변경 사항을 감지하기 위해 window 객체의 onlineoffline 이벤트를 수신합니다.

이전 버전에서는 네트워크 상태를 확인하는 데 navigator.onLine이 사용되었습니다. 하지만 Chromium 기반 브라우저에서는 제대로 작동하지 않습니다. 거짓 음성과 관련된 많은 문제가 있으며, 이로 인해 Query가 offline으로 잘못 표시됩니다.

이를 피하기 위해 이제 항상 online: true로 시작하고, 상태를 업데이트하기 위해 onlineoffline 이벤트만 수신합니다.

이렇게 하면 거짓 음성이 발생할 가능성이 줄어들지만, 인터넷 연결 없이도 작동할 수 있는 serviceWorkers를 통해 로드되는 오프라인 앱에서는 거짓 양성이 발생할 수 있습니다.

사용 가능한 메서드는 다음과 같습니다:

onlineManager.setEventListener

setEventListener를 사용하여 사용자 지정 이벤트 리스너를 설정할 수 있습니다:

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

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

onlineManager.subscribe

subscribe를 사용하여 온라인 상태 변경을 구독할 수 있습니다. 구독 취소 함수를 반환합니다:

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

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

onlineManager.setOnline

setOnline을 사용하여 온라인 상태를 수동으로 설정할 수 있습니다.

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

// Set to online
onlineManager.setOnline(true)

// Set to offline
onlineManager.setOnline(false)

옵션

  • online: boolean

onlineManager.isOnline

isOnline을 사용하여 현재 온라인 상태를 가져올 수 있습니다.

const isOnline = onlineManager.isOnline()