Migrating Flutter Web Google AI to Firebase: Beyond the Docs - Development Diary

Migrating Flutter Web Google AI to Firebase: Beyond the Docs


Google AI is evolving at an incredible pace. In less than a year, I've seen Gemini progress from version 1.0 to 2.5. As you might know, ITDOGTICS has developed several applications using Gemini, and this rapid evolution brings maintenance challenges, particularly with model deprecation. The recent announcement of Gemini 1.5's discontinuation, for instance, has led to the deprecation of some Flutter packages, including the google_generative_ai package I've been using. The next version will leverage Firebase AI.

While the syntax transition is relatively straightforward, a significant shift is the move away from user-based API keys to a centralized Firebase approach. This change introduces new security considerations.

In this blog post, I'll guide you through the migration process, helping you securely transition your project from the original google_generative_ai package to Firebase AI.

This guide is for:

  • Flutter Developers
  • Anyone interested in building Google Generative AI projects

How to Migrate Your Project

The migration process is generally simple. Here's a step-by-step guide:

1. Set Up Firebase for Your Project

First, you'll need to set up Firebase for your Flutter project. For detailed documentation on this, you can refer to the official Firebase documentation.

2. Enable AI Logic and App Check

After enabling AI Logic in your Firebase project, you'll be prompted to enable App Check. 


Important Note on reCAPTCHA Setup: When configuring reCAPTCHA, you must visit the reCAPTCHA website to create a new project. 


Do not type anything into the reCAPTCHA secret key field directly in the Firebase UI; 


this UI is misleading. The site ID generated on the reCAPTCHA website will be used within your code, a detail not explicitly stated elsewhere.

3. Update Your Code Syntax

Most of your existing syntax will remain the same, with one key change:

Replace GenerativeModel. with FirebaseAI.googleAI().

4. Initialize Firebase and App Check in main.dart

In your main.dart file, ensure you perform the necessary initializations:

Dart
void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  await FirebaseAppCheck.instance.activate(
    // Use the site ID generated from the reCAPTCHA website
    webRecaptchaSiteKey: 'YOUR_RECAPTCHA_SITE_ID',
  );
  runApp(MyApp());
}

It's at this point that some developers encounter issues, specifically the "Invalid AppCheck Token" error, which can be perplexing.

5. The Solution: Provide AppCheck Instance to FirebaseAI.googleAI()

The key to resolving the "Invalid AppCheck Token" error, a detail not widely documented, is to provide the FirebaseAppCheck.instance to your FirebaseAI.googleAI() call.

Your code should look like this:

Dart
// When initializing your GenerativeModel or making calls
FirebaseAI.googleAI(appCheck: FirebaseAppCheck.instance);

By following these steps and providing the FirebaseAppCheck instance, your application will successfully migrate to Firebase AI with enhanced security, ensuring a smooth and secure transition for your Generative AI projects.



Comments

Post a Comment

Popular posts from this blog

Resume Generator - Software Intro

Image
Stop Stressing Over Resumes! Introducing the AI-Powered Resume Generator Tired of job hunting? Feeling overwhelmed by applicant tracking systems (ATS)? Our AI-powered Resume Generator takes the pain out of crafting the perfect resume, allowing you to tailor it to each company in seconds! Built by ITDOGTICS, this tool will revolutionize your job search. Key Features: Personalized Resumes in Seconds: Input your information (stored securely on your device) and generate targeted resumes based on your unique background. Easy Data Import: Import your existing resume or other relevant documents to quickly populate your profile. Smart Data Extraction: Extract key information from academic results, certificates, and other documents for each category (e.g., education, experience). AI-Powered Writing Assistance: Get help crafting compelling descriptions for your skills and experience. Your Data Stays Safe: We prioritize your privacy. All data is stored securely on your device and is...
Read more

Build AI Code Generation Tools For Large Scale Project in Python? Part 1 - Development Diary and Discussion

Image
Building AI Code Generation Tools from Scratch in Python 3: A Journey from Zero to Everything (Part 1) Can we create AI code generation tools in Python 3 from the ground up? This is an open-ended question, and I don't claim to have all the answers. I welcome discussion and idea exchange, as I'm always open to learning. This exploration also reveals how I built the ITDOGTICS application for first prototype in just three days. While I believe there are limitations to current AI technology, I'll address those in a future blog post where I'll delve into how AI works and why it has become so prominent. If you're familiar with basic AI concepts, feel free to skip the introduction to  Scope of this Blog Post . This blog post assumes you have a basic understanding of Python 3. If you don't, it might be challenging to follow along. Disclaimer: I won't provide the complete project code, as I encourage discussion and collaboration. For beginners: Use this as a refer...
Read more

Expense Tracker - Software Intro

Image
Track Your Spending with Ease: Introducing the Expense Tracker App Are you tired of wondering where your money goes? Do you struggle to keep track of your daily expenses? Then look no further! The Expense Tracker App is designed to help you effortlessly record and understand your spending habits. Whether you're a meticulous budgeter or just want a clearer picture of your finances, this app simplifies expense tracking.  It is built by ITDOGTICS. Key Features: Effortless Spending Recording: Say goodbye to manual entry! Capture your receipts with your phone's camera, and let the app automatically extract the information. Intelligent Spending Analysis: Gain valuable insights into your spending patterns. See where your money is going and identify areas where you can save. Multi-Currency Support: Traveling abroad? No problem! The app supports exchange rates, making it easy to track your spending in different currencies and maintain accurate records. Secure Data Storage:...
Read more