shared_preferences

Flutter Web에서 사용자 세션 또는 인증 상태를 유지하기 위해 여러 접근 방식을 사용할 수 있습니다. 가장 일반적인 방법 중 하나는 웹 브라우저의 로컬 스토리지나 세션 스토리지를 사용하는 것입니다. 이를 통해 사용자가 새로 고침을 하거나 브라우저를 재시작해도 인증 상태를 유지할 수 있습니다.

Shared Preferences 사용하기

Flutter에서는 shared_preferences 패키지를 사용하여 간단하게 로컬 스토리지를 다룰 수 있습니다. 사용자의 로그인 정보(예: 토큰)를 로컬 스토리지에 저장하고, 앱이 시작될 때 이를 확인하여 로그인 상태를 유지할 수 있습니다.

  1. shared_preferences 패키지 추가:

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

    dependencies:
      flutter:
        sdk: flutter
      shared_preferences: ^2.0.6
    
  2. 로그인 정보 저장:

    사용자가 로그인에 성공하면 로그인 정보(예: JWT 토큰)를 로컬 스토리지에 저장합니다.

    import 'package:shared_preferences/shared_preferences.dart';
    
    Future<void> saveLoginInfo(String token) async {
      final SharedPreferences prefs = await SharedPreferences.getInstance();
      await prefs.setString('login_token', token);
    }
    
  3. 앱 시작 시 로그인 상태 확인:

    앱이 시작될 때 로컬 스토리지에서 로그인 정보를 가져와 로그인 상태를 확인합니다.

    Future<String?> getLoginInfo() async {
      final SharedPreferences prefs = await SharedPreferences.getInstance();
      return prefs.getString('login_token');
    }
    
  4. 로그아웃 시 정보 제거:

    사용자가 로그아웃할 때 로컬 스토리지의 로그인 정보를 제거합니다.

    Future<void> removeLoginInfo() async {
      final SharedPreferences prefs = await SharedPreferences.getInstance();
      await prefs.remove('login_token');
    }
    

인증 상태 관리

앱의 메인 화면이나 라우트 관리 부분에서 getLoginInfo 함수를 사용하여 로그인 상태를 확인하고, 사용자가 로그인 상태인 경우 바로 메인 화면으로 네비게이션하거나 필요한 사용자 정보를 불러옵니다. 로그인 상태가 아닌 경우 로그인 화면으로 이동하도록 합니다.

이러한 접근 방식을 사용하면 사용자가 웹 애플리케이션을 새로 고침하거나 브라우저를 재시작해도 로그인 상태를 유지할 수 있습니다.