Flutter多环境(Dev/QA)下Android与Web谷歌地图密钥配置方案

是否需要在dev/qa目录下新增AndroidManifest.xml？ #

需要。Android的source set机制允许不同环境目录下的配置文件与主目录（android/app/src/main）的文件合并，你只需要在dev和qa目录下创建仅包含环境差异配置的AndroidManifest.xml即可，无需复制主配置的全部内容。

具体配置步骤 #

1. 在android/app/src/dev/目录下创建AndroidManifest.xml，内容仅保留地图API密钥的meta-data配置：

<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application>
        <meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="你的DEV环境谷歌地图API密钥"/>
    </application>
</manifest>

2. 同理，在android/app/src/qa/目录下创建对应的AndroidManifest.xml，替换为QA环境的API密钥：

<manifest xmlns:android="http://schemas.android.com/apk/res/android">
    <application>
        <meta-data
            android:name="com.google.android.geo.API_KEY"
            android:value="你的QA环境谷歌地图API密钥"/>
    </application>
</manifest>

3. 编译时，Flutter会自动根据指定的flavor（dev/qa）合并主目录与对应环境目录的AndroidManifest.xml，无需额外配置。

Web端的核心是在加载谷歌地图JS脚本时传入对应环境的API密钥，以下是两种实用方案：

方案一：构建时动态替换密钥 #

1. 在web/index.html中，将API密钥设为占位符：

<script src="https://maps.googleapis.com/maps/api/js?key=GOOGLE_MAPS_API_KEY"></script>

2. 编写简单的构建脚本（Shell或Dart），构建前替换占位符：

• 构建DEV环境：

# 替换占位符为DEV密钥
sed -i '' 's/GOOGLE_MAPS_API_KEY/你的DEV环境密钥/g' web/index.html
# 执行Web构建
flutter build web --flavor dev
# 恢复原始文件（可选，避免影响后续构建）
git checkout web/index.html

• 构建QA环境：

sed -i '' 's/GOOGLE_MAPS_API_KEY/你的QA环境密钥/g' web/index.html
flutter build web --flavor qa
git checkout web/index.html

方案二：多模板文件切换 #

1. 在web/目录下创建两个模板文件：index_dev.html和index_qa.html，分别填入对应环境的API密钥：

<!-- index_dev.html -->
<script src="https://maps.googleapis.com/maps/api/js?key=你的DEV环境密钥"></script>

<!-- index_qa.html -->
<script src="https://maps.googleapis.com/maps/api/js?key=你的QA环境密钥"></script>

2. 构建前将对应模板复制为index.html：

• DEV构建：

cp web/index_dev.html web/index.html
flutter build web --flavor dev

• QA构建：

cp web/index_qa.html web/index.html
flutter build web --flavor qa

注意事项 #

• 确保google_maps_flutter_web依赖已正确添加到pubspec.yaml中。
• Web端的谷歌地图API密钥需要在谷歌云控制台启用Maps JavaScript API权限。

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