Question 80140 in Flutter Question posted in
The official Flutter documentation can be found here.

TypeError: Cannot read properties of undefined (reading 'init') || Flutter web

I have recently upgraded my flutter project from Flutter Beta to Flutter Stable 3.3.8.
after upgrading, I also upgraded all the firebase packages to the latest version.

Due to this upgrade on my config function, there is a new parameter of navigatorKey.
So I included that like this

class NavKey{
    static final navKey =  GlobalKey<NavigatorState>();
    }

static final Config config = Config(
  navigatorKey: NavKey.navKey,          //new parameter of navigatorKey
  tenant: "xx-3066-xx-xx-xx",
  clientId: "xx-ad66-xx-a6e6-xx",
  scope: "api://xx-xx-422a-a6e6-xx/xx",
  redirectUri:
      "xx://com.example.xx/xx%xx%3D");

Now If I run my project and enter my email id and hit enter it shows this error

TypeError: Cannot read properties of undefined (reading 'init')

on my void main() I have included all my Firebase initialize like this

Future<void> main() async {
  // await dotenv.load();
  WidgetsFlutterBinding.ensureInitialized();

  await Firebase.initializeApp(
      options: const FirebaseOptions(
          apiKey: "xxx-xx",
          authDomain: "xx-xxx.firebaseapp.com",
          databaseURL: "https://xxx-xx-default-xxx.xx.com",
          projectId: "xxx-xxx",
          storageBucket: "xxx-xx.appspot.com",
          messagingSenderId: "xxx",
          appId: "1:xx:web:xxx3d75b63xxxxe9",
          measurementId: "G-xxxx")
          );

  
  runApp(const MyApp()
      /* MaterialApp(//
  home: MyApp())*/
      );
}

on my index.html I have also included this script as I am running my project on flutter web

<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-storage.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-messaging.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-functions.js"></script>

These are my all errors

All errors

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Well, I am not able to find the solution for the latest package. That's why I rolled back my aad_oauth from ^0.4.0 to ^0.3.0 where it doesn't asked for navigatorKey

    Config(
    navigatorKey: NavKey.navKey,)

  2. 0

    Or use the following html file to replace "web/index.html’

    <!DOCTYPE html>
<html>

<head>
    <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    Fore more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
  -->
    <base href="/">

    <meta charset="UTF-8">
    <meta content="IE=Edge" http-equiv="X-UA-Compatible">
    <meta name="description" content="AAD OAUTH Example">

    <!-- iOS meta tags & icons -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="example">
    <link rel="apple-touch-icon" href="icons/Icon-192.png">

    <!-- Favicon 
  <link rel="icon" type="image/png" href="favicon.png" />
  -->
    <title>AAD OAUTH Example</title>
    <script type="text/javascript" src="https://alcdn.msauth.net/browser/2.13.1/js/msal-browser.min.js" integrity="sha384-2Vr9MyareT7qv+wLp1zBt78ZWB4aljfCTMUrml3/cxm0W81ahmDOC6uyNmmn0Vrc" crossorigin="anonymous"></script>
    <script src="assets/packages/aad_oauth/assets/msalv2.js"></script>
    <link rel="manifest" href="manifest.json">
</head>

<body>
    <!-- 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 -->
    <script>
        if ('serviceWorker' in navigator) {
            window.addEventListener('flutter-first-frame', function() {
                navigator.serviceWorker.register('flutter_service_worker.js');
            });
        }
    </script>
    <script src="main.dart.js" type="application/javascript"></script>
</body>

</html>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search