When I try to run my flutter app on chrome, it crashes. It happens only after I installed Firebase_core and runs fine on Android or iOS. I am trying to connect my flutter web app, to the same Firebase Cloud, as my other app. I have follewed the instructions in the firebase console and added a new app. I tried adding a new web app, following the steps, and when that didn't work, I tried the same with adding a flutter app. (Here I talking about the firebase console).
I tried to initialize the app in my main file like this:
import "package:firebase_core/firebase_core.dart" as core;
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await core.Firebase.initializeApp(
options: core.FirebaseOptions(
apiKey: "apiKey",
appId: "appId",
messagingSenderId: "messagingSenderId",
projectId: " projectId"
)
);
runApp(const MyApp());
}
And in my html I added this script to the body:
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "firebase/app";
import { getAnalytics } from "firebase/analytics";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "my apikey",
authDomain: "my authDomain",
databaseURL: "databaseURL",
projectId: "projectId",
storageBucket: "storageBucket",
messagingSenderId: "messagingSenderId",
appId: "appId",
measurementId: "measurementId"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
My pubspec.yaml is very simple:
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
firebase_core: ^2.1.1
The error I am getting:
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:46:15: Error: Method not found:
'getProperty'.
if (js_util.getProperty(e, 'name') == 'FirebaseError') {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:47:20: Error: Method not found:
'getProperty'.
return js_util.getProperty(e, 'code') ?? '';
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:59:15: Error: Method not found:
'getProperty'.
if (js_util.getProperty(e, 'name') == 'FirebaseError') {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:60:30: Error: Method not found:
'getProperty'.
String rawCode = js_util.getProperty(e, 'code');
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:62:30: Error: Method not found:
'getProperty'.
String message = js_util.getProperty(e, 'message') ?? '';
^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:48:14: Error: Method not found: 'allowInterop'.
getPath: allowInterop(strategy.getPath),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:49:15: Error: Method not found: 'allowInterop'.
getState: allowInterop(strategy.getState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:50:26: Error: Method not found: 'allowInterop'.
addPopStateListener: allowInterop(strategy.addPopStateListener),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:51:25: Error: Method not found: 'allowInterop'.
prepareExternalUrl: allowInterop(strategy.prepareExternalUrl),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:52:16: Error: Method not found: 'allowInterop'.
pushState: allowInterop(strategy.pushState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:53:19: Error: Method not found: 'allowInterop'.
replaceState: allowInterop(strategy.replaceState),
^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:54:9: Error: Method not found: 'allowInterop'.
go: allowInterop(strategy.go),
^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/js_interop.dart:25:12: Error: Method not
found: 'hasProperty'.
if (util.hasProperty(jsObject, 'toDateString')) {
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:45:31: Error: Method not found:
'getProperty'.
map[key] = dartify(util.getProperty(jsObject, key), customDartify);
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:81:22: Error: Method not found:
'newObject'.
var jsMap = util.newObject();
^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:83:12: Error: Method not found:
'setProperty'.
util.setProperty(jsMap, key, jsify(value, customJsify));
^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:89:12: Error: Method not found:
'allowInterop'.
return allowInterop(dartObject);
^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:103:10: Error: Method not found:
'callMethod'.
util.callMethod(jsObject, method, args);
^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:116:15: Error: Method not found:
'promiseToFuture'.
return util.promiseToFuture(thenable);
^^^^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:124:27: Error: Method not found:
'allowInterop'.
return PromiseJsImpl<S>(allowInterop((
I have tried to find and follow various tutorial on how to add firebase to a Flutter web app. Non of them helped me, since the problem seems to come from the firebase_core package. I have tried to add the firebase_core_web package. I also downgraded various firebase packages and tried with diffrent combinations based on what recommendations I could find online. I always got the same error.
I have upgraded flutter to the newest version.
The error can be simply recreated by creating af new flutter project, and install firebase_core. If you then run the app on chrome, the error will show up in the terminal. At least, that is what happens to me ...
!!! SOLVED !!!
I solved the problem with simply repairing the pub-cache folder using the " flutter pub cache repair " command. Hallelujah !