Flutter 网页风味

Posted 2023-02-23

【中文标题】Flutter 网页风味

【英文标题】：Flutter web flavor

【发布时间】：2020-12-10 22:38:08

【问题描述】：

我有一个使用 firebase 的 Flutter Web 应用程序，并且我有两个 firebase 项目（开发和产品）。 我想为这个项目设置 Flavours（只是 web 没有移动）。

在移动设备中，我可以使用不同的 GoogleService-Info.plist 或 google-services.json 文件作为任何一种风格，但我无法在网络应用程序上执行此操作，因为配置是在 index.html 文件中完成的。有没有办法做到这一点？可能有不同的 HTML 文件，并指定在运行应用程序时要捆绑哪些文件？

谢谢。

【参考方案1】：

您可以使用 Firebase SDK 自动配置。通过依赖保留的托管 URL，您可以将相同的代码部署到多个 Firebase 项目。

在您的每个 Firebase 项目上，转到项目概览 -> 项目设置。 See here

在“您的应用”下选择您的网络应用。如果您还没有，请将您的网络应用链接到 Firebase 托管网站。

在 Firebase SDK sn-p 中，选择 自动 选项。 See here

将 index.html 上的当前 firebase 配置替换为：

<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="/__/firebase/7.21.0/firebase-app.js"></script>

<!-- TODO: Add SDKs for Firebase products that you want to use
     https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="/__/firebase/7.21.0/firebase-analytics.js"></script>

<!-- Initialize Firebase -->
<script src="/__/firebase/init.js"></script>

就是这样，这将允许您将相同的 index.html 用于不同的风格。

More Info here

【参考方案2】：

见Flutter Firebase - Setting different deployment targets for ios, android, and Web。

这解释了如何为 iOS 和 Android 以及 Firebase SDK 为 Web 进行自动配置。