Flutter - 토큰을 어디에 저장할까?

#Flutter#WebCrypto
• • •

flutter_secure_storage

  • flutter_secure_storage로 암호화된 스토리지에 데이터 저장 가능
  • 각 운영체제, 실행환경에 적합한 스토리지를 사용
  • v5.0.0 버전 이후 Web도 지원, 크로스 플랫폼 앱에 적합한 패키지라고 할 수 있음
    • Web에서는 WebCrypto를 사용하여 클라이언트 측에서 데이터를 암호화하고 이를 로컬 스토리지에 저장하는 방식
    • 저장된 값은 현재 브라우저 및 도메인에서만 접근 가능
    • 다른 브라우저나 기기에서 복호화 불가능

사용 예시

TokenProvider
import 'package:flutter_secure_storage/flutter_secure_storage.dart';

abstract class TokenProvider {
  Future<String?> getToken();
  Future<void> setToken(String token);
  Future<void> deleteToken();
}

class SecureStorageTokenProvider implements TokenProvider {
  final FlutterSecureStorage _storage;
  static const _tokenKey = 'access_token';

  SecureStorageTokenProvider(this._storage);

  @override
  Future<String?> getToken() async {
    return await _storage.read(key: _tokenKey);
  }

  @override
  Future<void> setToken(String token) async {
    await _storage.write(key: _tokenKey, value: token);
  }

  @override
  Future<void> deleteToken() async {
    _storage.delete(key: _tokenKey);
  }
}
AuthClient
class AuthClient {
  // ... 
	
  Future<Result<dynamic, AuthError>> signin({
    required String email,
    required String password,
  }) async {
    try {
      final response = await _dio.post('/auth/login', data: data);
      if (response.statusCode != 200) {
        return Result.error(AuthError.signinError);
      }
      await tokenProvider.setToken(token);
      return Result.ok(response.data);
    } catch (e) {
      return Result.error(AuthError.unknown);
    }
  }

  Future<Result<dynamic, AuthError>> signout() async {
    try {
      await tokenProvider.deleteToken();
      return Result.ok(null);
    } catch (e) {
      return Result.error(AuthError.unknown);
    }
  }
}

출처

published 10 months ago · last updated 10 months ago