Flutter

[Flutter] 앱에서 iOS와 AOS에서 스크린샷 방지하기

흐성진 2024. 7. 23. 13:50
반응형

Flutter 앱에서 iOS와 AOS에서 스크린샷 방지하기

혹시 중요한 정보를 다루는 앱을 개발하면서 스크린샷 방지 기능이 필요했던 적이 있으신가요? 뉴스나 은행 앱처럼 민감한 정보를 다루는 앱들은 사용자 개개인의 데이터 보호를 위해 스크린샷을 방지하는 기능이 종종 필요합니다.

오늘은 Flutter 앱에서 iOS와 AOS(안드로이드 운영 시스템)에서 스크린샷을 방지하는 방법에 대해 알아보겠습니다. 코드 예제와 함께 설명드리니 천천히 따라오세요!

Flutter에서 iOS 스크린샷 방지

 

iOS에서 스크린샷 방지하기

먼저, iOS에서 스크린샷을 방지하기 위해 우리는 AppDelegate.swift 파일을 수정해야 합니다.

import UIKit
import Flutter

@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
  override func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
  ) -> Bool {
    self.window.makeSecure()
    GeneratedPluginRegistrant.register(with: self)
    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
  }
}

코드를 보시면 application 메서드에서 self.window.makeSecure()를 호출하는 부분이 있습니다. 이 메서드를 통해 화면을 보호할 수 있습니다.

그리고 다음 확장을 통해 makeSecure 메서드를 구현합니다.

 

extension UIWindow {
    func makeSecure() {
        let field = UITextField()
        let view = UIView(frame: CGRect(x: 0, y: 0, width: field.frame.self.width, height: field.frame.self.height))
        field.isSecureTextEntry = true
        self.addSubview(field)
        self.layer.superlayer?.addSublayer(field.layer)
        field.layer.sublayers?.last!.addSublayer(self.layer)
        field.leftView = view
        field.leftViewMode = .always
    }
}

이 확장 코드에서는 UIWindow에 보호 필드를 추가하여 스크린샷을 방지합니다. 간단하지만 매우 효과적인 방법이죠.

 

iOS 스크린샷 방지 코드 설명

  • makeSecure: 이 메서드를 통해 텍스트 필드를 생성하고 필요한 속성들을 설정합니다. 이를 통해 사용자 인터페이스 상에서 스크린샷이나 화면 녹화를 방지합니다.
  • addSubview, addSublayer: 이 메서드들을 통해 필드와 레이어를 추가하여 보안을 강화합니다.

 

AOS(안드로이드)에서 스크린샷 방지

AOS에서는 약간 다른 접근 방식이 필요합니다. Android는 FlutterWindowManager 플러그인을 사용하여 쉽게 스크린샷을 방지할 수 있습니다.

 

Android 스크린샷 방지하기

먼저 pubspec.yaml 파일에 flutter_windowmanager 패키지를 추가합니다:

 

flutter pub add flutter_windowmanager

 

or

dependencies:
  flutter:
    sdk: flutter
  flutter_windowmanager: ^0.2.0

 

이제 main.dart 파일에서 스크린샷 방지 코드를 추가합니다:

 

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_windowmanager/flutter_windowmanager.dart';

void main() async {
  runApp(MyApp());
  WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
    if (Platform.isAndroid) {
      await FlutterWindowManager.addFlags(FlutterWindowManager.FLAG_SECURE);
    }
  });
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('스크린샷 방지 앱'),
      ),
      body: Center(
        child: Text('이 화면은 스크린샷이 방지됩니다.'),
      ),
    );
  }
}

Android 스크린샷 방지 코드 설명

  • FlutterWindowManager.addFlags: 이 메서드를 통해 스크린샷 방지를 활성화할 수 있습니다. FLAG_SECURE 플래그를 설정하면 스크린샷과 화면 녹화가 비활성화됩니다.
  • Platform.isAndroid: 현재 플랫폼이 Android인지 확인합니다. iOS나 다른 플랫폼에서는 이 코드 블록이 실행되지 않습니다.

결론

여기까지 Flutter 플랫폼에서 iOS와 Android에서 스크린샷을 방지하는 방법을 알아보았습니다. 두 운영체제 모두에서 작동하는 코드를 추가해보았으니 실제 프로젝트에 적용하여 중요한 사용자 데이터를 보호해보세요.

앱을 테스트할 때는 실제 기기에서 확인하는 것이 중요합니다. 에뮬레이터나 시뮬레이터에서는 동작하지 않을 수 있습니다.

반응형