Flutter Firebase App Check적용하기

 

1. Firebase App Check

- 앱의 보안성을 강조하기 위한 서비스 입니다. 앱의 무단 접근, 자동화 봇 등에 의한 보안 위협으로부터 앱을 보호하면, 신뢰할 수 있는 사용자만이 앱에 액세스 할 수 있도록 보장합니다.

- Firebase App Check는 클라이언트-서버 인증 방식을 사용하여 동작합니다. 앱 클라이언트는 인증된 앱으로 등록되어 있는지 확인하기 위해 Firebase App Check SDK를 사용하여 앱 서버에 요청을 보내고, 서버는 이 요청에 대해 Firebase App Check API를 사용하여 요청을 검증합니다. 이를 통해 클라이어트가 신뢰할 수 있는 Firebase 프로젝트에 속하는 앱인지 확인하고, 무단 액세스를 차단할 수 있습니다.

 

2. Flutter에 적용하기

• Firebase Console에서 Firebase 프로젝트를 생성하고, 해당 프로젝트에 Firebase App Check를 활성화합니다.
• Flutter 프로젝트의 pubspec.yaml 파일에  Firebase App Check Flutter 패키지를 추가합니다. 

dependencies:
  firebase_app_check: ^0.7.0

• Flutter 프로젝트의 main.dart 파일에 Firebase App Check를 구성합니다. 

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

void main() async {
  // Firebase 초기화
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();

  // Firebase App Check 활성화
  FirebaseAppCheck.instance.activate(webRecaptchaSiteKey: 'YOUR_RECAPTCHA_SITE_KEY');

  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Firebase App Check Demo',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter Firebase App Check Demo'),
        ),
        body: Center(
          child: Text('Hello World!'),
        ),
      ),
    );
  }
}

• Firebase App Check를 사용하여 네트워크 요청을 검증하기 위해 package:http 패키지를 사용하여 네트워크 요청을 보낼 때, FirebaseAppCheckToken을 추가합니다.

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:firebase_app_check/firebase_app_check.dart';

final _httpClient = http.Client();

Future<String> fetchData() async {
  // Firebase App Check 토큰 가져오기
  final FirebaseAppCheckToken appCheckToken = await FirebaseAppCheck.instance.getToken();

  // 네트워크 요청 보내기
  final response = await _httpClient.get(
    Uri.parse('https://example.com/data.json'),
    headers: {
      // Firebase App Check 토큰 헤더 추가
      'X-Firebase-AppCheck': 'Bearer ${appCheckToken.token}',
    },
  );

  // 데이터 반환
  return utf8.decode(response.bodyBytes);
}