[flutter] dio_retry 패키지를 사용하여 API 호출에 대한 에러 페이지 표시하기

이 기사에서는 flutter 앱에서 dio_retry 패키지를 사용하여 API 호출 중에 발생하는 에러를 처리하고 에러 페이지를 표시하는 방법에 대해 알아보겠습니다.

1. dio_retry 패키지란?

dio_retry는 flutter 앱에서 네트워크 호출을 위한 HTTP client 라이브러리인 dio의 wrapper로, 네트워크 요청 중에 발생한 오류를 처리하고 재시도하는 기능을 제공합니다.

2. dio_retry 패키지 설치

pubspec.yaml 파일에 dio_retry 패키지를 추가합니다.

dependencies:
  dio: ^4.0.0
  dio_retry: ^4.0.0

그리고 터미널에서 아래 명령어를 실행하여 패키지를 설치합니다.

flutter pub get

3. dio_retry로 API 호출 및 에러 처리

다음은 dio_retry를 사용하여 API 호출을 수행하고 에러를 처리하는 예제 코드입니다.

import 'package:dio/dio.dart';
import 'package:dio_retry/dio_retry.dart';

void main() {
  final dio = Dio();  // 먼저 Dio 인스턴스를 생성합니다.
  
  final options = BaseOptions(
    baseUrl: 'https://api.example.com',
  );

  final dioRetry = DioRetry(
    dio: dio, 
    options: options,
    retries: 3,  // 재시도 횟수
    retryInterval: Duration(seconds: 2),  // 재시도 간격
  );

  dioRetry.interceptor();  // dioRetry 인터셉터를 등록합니다.

  dioRetry
      .get('/api/data')
      .then((response) {
        // 성공적으로 응답을 받은 경우 처리
        print(response.data);
      })
      .catchError((e) {
        // 에러 처리
        print('Error occurred: $e');
        // 에러 페이지를 표시하는 로직을 추가할 수 있습니다.
      });
}

4. 에러 페이지 표시

API 호출 중에 발생한 에러를 처리하여 에러 페이지를 표시하는 방법은 다양할 수 있습니다. 주로 catchError 블록에서 해당 로직을 처리합니다. 예를 들어, flutter의 Navigator를 사용하여 에러 페이지를 띄울 수 있습니다.

.catchError((e) {
  // 에러 페이지를 표시하는 로직
  Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => ErrorPage()),
  );
});

위 예제에서는 API 호출 중에 발생한 에러를 처리하여 ErrorPage로 이동하는 방법을 보여주고 있습니다.

이제 dio_retry를 사용하여 API 호출 중에 발생한 에러를 처리하고 에러 페이지를 표시하는 방법에 대해 알아보았습니다. dio_retry를 통해 네트워크 호출을 보다 안정적으로 처리할 수 있습니다.

더 많은 정보는 dio_retry 공식 문서를 참고하세요.