Flutter Web передает аутентификацию Firebase в HTML

В веб-приложении Flutter я инициализирую Firebase в index.html, как показано ниже.

<body>
  <!-- Check type of device and block all mobile phone devices! Tablets should work -->
  <!-- This script installs service_worker.js to provide PWA functionality to
       application. For more information, see:
       https://developers.google.com/web/fundamentals/primers/service-workers -->
  <!-- Firebase App (the core Firebase SDK) is always required and must be listed first -->
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-app.js"></script>

  <!-- If you enabled Analytics in your project, add the Firebase SDK for Analytics -->
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-analytics.js"></script>

  <!-- Add Firebase products that you want to use -->
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-auth.js"></script>
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-firestore.js"></script>
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-storage.js"></script>
  <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-functions.js"></script>
  <script src = "init-firebase.js" defer></script>
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function () {
        navigator.serviceWorker.register('flutter_service_worker.js?v=3005614081');
      });
    }
  </script>
  <script src = "main.dart.js" type = "application/javascript"></script>
</body>

Кроме того, у меня есть файл init-firebase.js для конфигурации Firebase, как показано ниже.

// Initialize Firebase
var firebaseConfig = {
    apiKey: "...",
    authDomain: "...",
    databaseURL: "...",
    projected: "...",
    storageBucket: "...",
    messagingSenderId: "...",
    appId: "...",
    measurementId: "..."
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);

Это работает нормально, и в Dart я могу получить доступ к Firebase Auth и т. д.

Однако мне интересно, как я могу получить доступ к Firebase Auth, когда я открываю новый файл HTML в приложении, например example.html?

class Test extends StatefulWidget {
  @override
  _TestState createState() => _TestState();
}

class _TestState extends State<Test> {
  @override
  void initState() {
    _showDocument();
    super.initState();
  }

  _showDocument() async {
    await ui.platformViewRegistry.registerViewFactory(
        'ExamplePage',
        (int viewId) => IFrameElement()
          ..src = 'https://example.com'
          ..style.border = 'none');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Container(
      child: HtmlElementView(viewType: 'ExamplePage'),
    ));
  }
}

В example.html, как показано ниже, я хотел бы получить доступ к данным Firebase, таким как Auth, Storage и т. д., Для пользователей, которые прошли аутентификацию в веб-приложении Flutter, но я не могу. Вызов моего init-firebase.js снова запустит Firebase.

<html>

<head>
    <link rel = "shortcut icon" type = "image/png" href = "favicon.png" />
    <title>Example</title>
    <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-app.js"></script>
    <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-auth.js"></script>
    <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-firestore.js"></script>
    <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-storage.js"></script>
    <script defer src = "https://www.gstatic.com/firebasejs/8.2.0/firebase-functions.js"></script>
    <!-- <script src = "init-firebase.js" defer></script> -->
</head>

<body>
    <div id = "my-view" style = "height: 95%; width: 100%;" oncontextmenu = "return false;"></div>
    <script>
        // Access Firebase data like AUTH, Storage, Firestore here.....
    </script>
</body>

</html>

Веб-приложение Flutter по-прежнему находится на той же вкладке, что и index.html, и я открываю в нем только другое HTML-окно. Есть ли способ передать Firebase в HTML?

Эй, Фрэнк. Спасибо за напоминание. Все еще думал о решении, и иногда это занимает немного больше времени. Пожалуйста, смотрите мои комментарии ниже и, пожалуйста, добавляйте любые мысли.

— 24.12.2020 10:24

javascript firebase flutter flutter-web

20.12.2020 18:03

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Раскрытие чувствительных данных

Все внешние компоненты, рассмотренные здесь до сих пор, взаимодействуют с клиентской стороной. Однако, если они подвергаются атаке, они не...

Компонент против элемента в ReactJS - секрет оптимизации производительности за счет повторного использования элементов

Проще говоря, компонент - это фабрика для создания элементов.

Зод: сила проверки и преобразования данных

Сегодня я хочу познакомить вас с библиотекой Zod и раскрыть некоторые ее особенности, например, возможности валидации и трансформации данных, а также...

Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf

Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.

Руководство ChatGPT по продаже мини JS-файлов

JS-файл - это файл, содержащий код JavaScript. JavaScript - это язык программирования, который в основном используется для добавления интерактивности...

206

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Невозможно передать экземпляр FirebaseApp (или службы, взятые из него, такие как база данных или аутентификация) между страницами. Каждая веб-страница, загружаемая в браузере, представляет собой отдельный экземпляр, и ей необходимо загрузить используемые ею службы Firebase.

Я думал об этом и думал о решении моей проблемы. В конце концов я согласен, что вы не можете передать экземпляр FirebaseApp. Теперь я использую каналы JavaScript для связи между представлениями, чтобы данные, которые я должен передать в Firebase, возвращались сначала для экземпляра FirebaseApp, и оттуда выполнялись любые действия.

— 24.12.2020 10:23

20.12.2020 18:16