[flutter] get_it를 사용하여 플러터 앱에서 웹소캣 통신을 어떻게 구현하는가?

30 Nov 2023

flutter

웹소캣을 사용하여 플러터 앱에서 실시간 통신을 구현하려면 get_it 라이브러리를 사용하여 의존성 주입을 관리해야 합니다. 이 글에서는 get_it를 사용하여 웹소캣 통신을 구현하는 방법에 대해 알아보겠습니다.

get_it 라이브러리 추가하기

먼저, pubspec.yaml 파일을 열고 get_it 라이브러리를 의존성으로 추가해야 합니다. 아래와 같이 get_it를 추가하세요.

dependencies:
  get_it: ^7.0.3

그리고 터미널에서 flutter pub get 명령을 실행하여 의존성을 업데이트하세요.

get_it를 사용하여 의존성 주입 설정하기

의존성 주입을 위해 get_it 패키지를 사용합니다. 이를 위해 앱의 시작 지점에서 main 함수를 변경해야 합니다. 아래와 같이 코드를 수정하세요.

import 'package:flutter/material.dart';
import 'package:get_it/get_it.dart';

void main() {
  setupLocator(); // 의존성 주입 설정 함수 호출
  runApp(MyApp());
}

// 의존성 주입 설정 함수
void setupLocator() {
  GetIt.I.registerLazySingleton(() => WebSocketService());
}

setupLocator 함수는 get_it의 GetIt 인스턴스를 사용하여 WebSocketService를 등록합니다. WebSocketService는 웹소캣 통신을 관리하는 클래스입니다.

웹소캣 서비스 구현하기

이제 WebSocketService 클래스를 구현해야 합니다. WebSocketService는 web_socket_channel 패키지를 사용하여 웹소캣 통신을 처리합니다. 아래와 같이 코드를 작성하세요.

import 'package:web_socket_channel/web_socket_channel.dart';
import 'package:web_socket_channel/io.dart';

class WebSocketService {
  final channel = IOWebSocketChannel.connect('ws://example.com/ws');

  void sendMessage(String message) {
    channel.sink.add(message);
  }
}

WebSocketService 클래스는 web_socket_channel의 IOWebSocketChannel을 사용하여 웹소캣 연결을 생성하고, sendMessage 메서드를 사용하여 메시지를 전송합니다. 실제로 사용할 웹소캣 주소로 연결을 변경하세요.

get_it를 사용하여 웹소캣 서비스 주입받기

이제 WebSocketService를 사용하려는 곳에서 get_it를 사용하여 의존성을 주입받을 수 있습니다. 다음은 MyHomePage 위젯에서 WebSocketService를 주입받는 예시입니다.

import 'package:flutter/material.dart';
import 'package:get_it/get_it.dart';

class MyHomePage extends StatelessWidget {
  final WebSocketService _webSocketService = GetIt.I<WebSocketService>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('WebSocket Example'),
      ),
      body: Center(
        child: FlatButton(
          onPressed: () {
            _webSocketService.sendMessage('Hello, WebSocket!');
          },
          child: Text('Send Message'),
        ),
      ),
    );
  }
}

위의 예시에서는 GetIt의 I 프로퍼티를 사용하여 WebSocketService를 주입받고, sendMessage 메서드를 호출하여 메시지를 전송합니다.

이제 앱에서 get_it를 사용하여 웹소캣 통신을 구현할 때 필요한 설정과 코드를 알게 되었습니다. 이를 통해 실시간 통신이 필요한 앱을 구현할 수 있습니다.