[flutter] @firebase/app-check: FirebaseError: AppCheck: ReCAPTCHA error. (appCheck/recaptcha-error). 해결방법

 

이전에 앱 체크를 설치했었는데 웹을 배포하고 실행해보니 앱체크가 제대로 작동하지 않아 

확인되지 않음으로 들어오고 realtime database의 값을 가져오지 못하는 문제가 발생하고 있었다.

 

개발자 콘솔에는 @firebase/app-check: FirebaseError: AppCheck: ReCAPTCHA error. (appCheck/recaptcha-error).

에러가 계속 발생하고..

 

firebase 공식 문서 상에는 앱체크 초기화만 해주면 된다고 이렇게 소스가 나와있었는데

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

// Import the firebase_app_check plugin
import 'package:firebase_app_check/firebase_app_check.dart';

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  await FirebaseAppCheck.instance.activate(
    webRecaptchaSiteKey: 'recaptcha-v3-site-key',
    // Default provider for Android is the Play Integrity provider. You can use the "AndroidProvider" enum to choose
    // your preferred provider. Choose from:
    // 1. Debug provider
    // 2. Safety Net provider
    // 3. Play Integrity provider
    androidProvider: AndroidProvider.debug,
    // Default provider for iOS/macOS is the Device Check provider. You can use the "AppleProvider" enum to choose
        // your preferred provider. Choose from:
        // 1. Debug provider
        // 2. Device Check provider
        // 3. App Attest provider
        // 4. App Attest provider with fallback to Device Check provider (App Attest provider is only available on iOS 14.0+, macOS 14.0+)
    appleProvider: AppleProvider.appAttest,
  );
  runApp(App());
}

 

아무리 찾아봐도 뭔가 초기화만 하고 끝날 문제가 아니여서 찾다보니

 

Realtime Database나 각종 firebase의 솔루션에서 앱체크를 써서 보안을 이용하려면

쓰고자하는 솔루션에 토큰값을 보내야한다고 예제가 적혀있는데...

아.. 한시간 넘게 찾아도 RealtimeDatabase에 토큰값을 보내는 방법은 없었다..

 

그래서 FirebaseAppCheck.instance안에 토큰을 호출하는게 있겠지 싶어서 instance안에 내용을 찾아봤더니

토큰 가져오는게 있었다...

 

Firebase 문서가 너무 불친절한거 아니냐고..!

 

소스를 다음과 같이 수정하고 빌드후 배포하였더니 에러가 사라졌다..!

 

Future<void> main() async {
  await FirebaseAppCheck.instance.activate(
    webRecaptchaSiteKey: '키값~',
  );
  if (!kDebugMode) {
    await FirebaseAppCheck.instance.getToken();
  }
}

 

await FirebaseAppCheck.instance.getToken();

을 호출후 파이어베이스에서 제공하는 솔루션들을 호출하면 앱체크가 정상적으로 작동하는걸 확인할수 있었다.

 

ㅠㅠㅠ 사라져버린 내 2시간