Flow 재요청 버튼 활용하기

개요

Android App의 Flow API 사용 중 오류 발생 시 버튼을 통해 재 요청이 가능하도록 기능 구현 중 이었다. 그러나 재 요청 버튼 클릭 시 로그상으로 2회 이상 응답을 받아오는 현상이 발생했고, 이를 어떻게 수정했는지 공유하고자 한다.

먼저, 구현부를 살펴보겠다.

viewModel에서 이미지 목록을 요청하는 코드인데, imageFlow 요청 실패 시 Error UI가 보여지고, Error UI의 버튼 클릭 시 fetchImageList() 함수를 수행하도록 했다.

class MainViewModel @Inject constructor(
    private val gettyRepository: GettyRepository
): ViewModel() {

val isLoading: MutableLiveData<Boolean> = MutableLiveData(true)
val isError: MutableLiveData<Boolean> = MutableLiveData(false)

private val imageFetchIndex: MutableStateFlow<Int> = MutableStateFlow(1)
private val imageFlow: MutableStateFlow<List<ImageSrc>> = MutableStateFlow(emptyList())

init {
    fetchImageList()
}

fun fetchImageList() {
        viewModelScope.launch {
            imageFetchIndex.flatMapLatest { page ->
                Timber.d("page index : $page")
                gettyRepository.getImages(
                    page = page,
                    onStart = {
                                            isLoading.postValue(true)
                    },
                    onComplete = {
                                            isLoading.postValue(false)
                      isError.postValue(false)
                    },
                    onError = {
                                            isLoading.postValue(false)
                      isError.postValue(true)
                    })
            }.collectLatest {
                imageFlow.value = it
            }
        }
    }
}

문제점

로그를 통해 문제점을 확인 하던 중, 버튼 클릭 수 만큼 로그가 찍히는 것을 확인할 수 있었다. 따라서, 이전에 실행했던 함수 내부의 코루틴이 종료되지 않아서 발생하는 것인지 확인해봤다.

페이지 인덱스 확인과 동시에 현재 job의 주소를 로그로 찍었고 재시도 버튼을 3회 실행 후 확인해봤다.

D  page index : 1 jobs StandaloneCoroutine{Active}@a708503 // init 시 생성된 job
D  page index : 1 jobs StandaloneCoroutine{Active}@2414037 // 버튼 클릭시 생성
D  page index : 1 jobs StandaloneCoroutine{Active}@4ad4309 // 버튼 클릭시 생성
D  page index : 1 jobs StandaloneCoroutine{Active}@a9d4a41 // 버튼 클릭시 생성

D  page index : 2 jobs StandaloneCoroutine{Active}@a708503
D  page index : 2 jobs StandaloneCoroutine{Active}@2414037
D  page index : 2 jobs StandaloneCoroutine{Active}@4ad4309
D  page index : 2 jobs StandaloneCoroutine{Active}@a9d4a41

새로 생성된 코루틴 때문에 요청도 똑같이 증가한 것으로 보인다.

해결

해결은 단순하게 에러 상황이라면, 현재 실행중인 코루틴을 cancel 하도록 수정했다.

onError = {
  Timber.d("Exception Occurred : $it")
  isLoading.postValue(false)
  isError.postValue(true)
  coroutineContext.cancel() // 오류 상황에서는 코루틴 캔슬
})

수정 후에는 요청을 여러번 해도 2회 이상 로그가 찍히지 않는것을 확인했다.