Flutter Web App基于Firebase的测试与生产多环境配置方案咨询

针对你遇到的firebase_options.dart无法同时配置测试/生产两个Firebase项目的问题，以下是两种可落地的解决方案：

方案一：多份配置文件+构建时动态导入 #

通过创建对应环境的配置文件，配合构建参数决定加载哪份配置，完全适配你已有的Firebase项目别名配置。

1. 创建多份Firebase配置文件
   复制现有firebase_options.dart，分别命名为firebase_options_test.dart和firebase_options_prod.dart，替换文件内的配置参数为对应测试/生产Firebase项目的信息（可从Firebase控制台导出Web配置）。

2. 修改入口文件动态导入配置
   在main.dart中通过dart-define参数判断导入的配置文件：

   import 'package:flutter/material.dart';
   import 'package:firebase_core/firebase_core.dart';
   import 'firebase_options_test.dart' 
       if (dart.define.env == 'prod') 'firebase_options_prod.dart' as firebase_options;
   
   void main() async {
     WidgetsFlutterBinding.ensureInitialized();
     await Firebase.initializeApp(
       options: firebase_options.DefaultFirebaseOptions.currentPlatform,
     );
     runApp(const MyApp());
   }
   

3. 构建与部署命令

   • 构建测试环境包：

     flutter build web --dart-define=env=test
     

   • 构建生产环境包：

     flutter build web --dart-define=env=prod
     

   • 部署到对应Firebase项目（配合你已配置的别名）：

     # 测试环境
     firebase deploy --project test
     # 生产环境
     firebase deploy --project prod
     

方案二：环境变量+动态生成配置 #

通过环境变量文件存储不同环境的Firebase参数，构建时加载对应文件并动态生成FirebaseOptions，适合需要频繁修改配置的场景。

1. 创建环境配置文件
   在项目根目录创建.env.test和.env.prod文件，分别填入对应Firebase项目的配置参数：

   # .env.test 示例
   FIREBASE_API_KEY=your_test_api_key
   FIREBASE_AUTH_DOMAIN=your-test-project.firebaseapp.com
   FIREBASE_PROJECT_ID=your-test-project
   FIREBASE_STORAGE_BUCKET=your-test-project.appspot.com
   FIREBASE_MESSAGING_SENDER_ID=123456789
   FIREBASE_APP_ID=1:123456789:web:abcdef123456789
   

2. 添加依赖与修改入口文件
   在pubspec.yaml中添加flutter_dotenv依赖：

   dependencies:
     flutter_dotenv: ^5.1.0
   

   然后修改main.dart加载对应环境的配置并初始化Firebase：

   import 'package:flutter/material.dart';
   import 'package:firebase_core/firebase_core.dart';
   import 'package:flutter_dotenv/flutter_dotenv.dart';
   
   void main() async {
     WidgetsFlutterBinding.ensureInitialized();
     // 获取构建时传入的环境参数，默认使用测试环境
     final env = const String.fromEnvironment('env', defaultValue: 'test');
     // 加载对应环境的配置文件
     await dotenv.load(fileName: '.env.$env');
   
     await Firebase.initializeApp(
       options: FirebaseOptions(
         apiKey: dotenv.env['FIREBASE_API_KEY']!,
         authDomain: dotenv.env['FIREBASE_AUTH_DOMAIN']!,
         projectId: dotenv.env['FIREBASE_PROJECT_ID']!,
         storageBucket: dotenv.env['FIREBASE_STORAGE_BUCKET']!,
         messagingSenderId: dotenv.env['FIREBASE_MESSAGING_SENDER_ID']!,
         appId: dotenv.env['FIREBASE_APP_ID']!,
       ),
     );
     runApp(const MyApp());
   }
   

3. 构建与部署命令
   构建命令同方案一，部署时指定对应Firebase项目别名即可。同时注意将.env.*文件添加到.gitignore，避免敏感信息提交到版本库。

内容的提问来源于stack exchange，提问作者Thomas Avieny