Error: Firebase: No Firebase App '[DEFAULT]' has been created

Question

I have a React Native app that uses Firebase for various functions. It was working perfectly for 2 weeks until I got the below error. I haven't changed anything in the App.js so don't know why this issue would come across.

[DEFAULT]: Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).

Here is my config code placed in my App.js:

const firebaseConfig = {
    apiKey: '<api-key>',
    authDomain: '<app-name>.firebaseapp.com',
    databaseURL: 'https://<app-name>.firebaseio.com',
    projectId: '<project-id>',
    storageBucket: '<app-name>.appspot.com',
    messagingSenderId: '<messaging-sender-id>',
    appId: '<app-id>'
};
firebase.initializeApp(firebaseConfig);

This code only runs if I comment out the firebase code like the below in one of my components:

const { currentUser } = firebase.auth();
console.log(currentUser);

Here is my console.log(firebase.app());

The most logical explanation is that either this code doesn't get run, or it gets run after the call that raises the error. You might want to set a breakpoint or add some logging to see which of these it is. — Frank van Puffelen, Jun 17 '19 at 23:28
@FrankvanPuffelen The function that this block of code is in is the `componentDidMount`. I did a `console.log` after this config in the `componentDidMount` and it ran. — Annabelle Sykes, Jun 17 '19 at 23:37
@FrankvanPuffelen What is quite weird is that in one of my components, if I comment out the code relating to firebase, this error goes away. I've updated my question. — Annabelle Sykes, Jun 17 '19 at 23:40

andresmijares · Answer 1 · 2019-06-20T00:37:17.127

5

UPDATE You have all your configuration settings on your componentDidMount, might run several times while which leads to the problem you are having, I made the following changes and worked like a charm:

I create a firebase.js on the root, next to the App.js, that files look like this

import `firebase/app`
require(`firebase/auth`)

const firebaseConfig = {
    apiKey: '<api-key>',
    authDomain: '<app-name>.firebaseapp.com',
    databaseURL: 'https://<app-name>.firebaseio.com',
    projectId: '<project-id>',
    storageBucket: '<app-name>.appspot.com',
    messagingSenderId: '<messaging-sender-id>',
    appId: '<app-id>'
};
if (!firebase.apps.length) {
   firebase.initializeApp(firebaseConfig);
}

export auth = firebase.auth()
export default firebase

And your App.js then looks like this:

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import reducers from './reducers';
import ReduxThunk from 'redux-thunk';
import Router from './Router';
import { auth } from './firebase' // <----

class App extends Component {
    componentDidMount () {
       this.checkAuth()
    }
    checkAuth = () {
       auth.onAuthStateChanged(function(user, err) {
          console.log(user);
            if (user) {
              console.log(user);
               Actions.signUpVerify();
            } else {
                console.log(err);
            }
      });
    }

    render() {
        const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
        return (
            <Provider store={store}>
                <Router />
            </Provider>
        )
    }
}

export default App;

You should not run the auth on your render method cause it might run potentially a lot of times.

edited Jun 20 '19 at 00:37

answered Jun 17 '19 at 23:52

andresmijares

3,658
4
34
40

Hello, I implemented this, but the app is still coming across as [DEFAULT] – Annabelle Sykes Jun 18 '19 at 23:14
`Firebase.apps` is coming as an empty array – Annabelle Sykes Jun 18 '19 at 23:30
then i need more information about your set up, it’s hard to tell where you error is – andresmijares Jun 19 '19 at 00:09
I've added my `console.log(firebase.app())` to the project. Hope this helps – Annabelle Sykes Jun 19 '19 at 14:02
is this public project? can i see a github or something? did u just create this map? you based all the question around a react lifecycle method, that is not good enough information, sorry – andresmijares Jun 19 '19 at 15:50
I also changed the config to run in `componentWillMount` and it didn't change anything – Annabelle Sykes Jun 20 '19 at 00:21
When I do get Firebase to run at times, I get the error "A network error (such as timeout, interrupted connection or unreachable host) has occurred." (auth/network-request-failed) when signing up a user – Annabelle Sykes Jun 20 '19 at 00:26
I was able to replicated, the first solution I gave u worked perfect, I will update the answer – andresmijares Jun 20 '19 at 00:31
Thanks for your help on this. I have got this to work now, but when using Firebase authentication, I get the error: auth/network-request-failed – Annabelle Sykes Jun 20 '19 at 00:35

score 2 · Answer 2 · edited Mar 26 '20 at 08:01

In the react native app you don't have to configure firebase from javascript side.
In the IOS side, for example, add following lines within AppDelegate.m to initialize firebase manually.

At the top of the file import the Firebase module:

#import <Firebase.h>

Within the didFinishLaunchingWithOptions method, add the configure method:

(BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    if ([FIRApp defaultApp] == nil) {
      [FIRApp configure];
    }
}

score 0 · Answer 3 · answered Jun 03 '20 at 10:56

I used to have the same issue in almost all my firebase projects but the solution to your problem is easy. You are trying to check an authenticated user as I see. The problem is that that method is asynchronous and the way you are implementing it isn't right. What you would do is use the firebase.onAuthstateChanged method and place it just after your firebase initialization area, something like this:

firebase.initializeApp({
  apiKey: '<api-key>',
  authDomain: '***',
  databaseURL: '***',
  projectId: '***',
  storageBucket: '***',
  messagingSenderId: '***',
  appId: '***',
  measurementId: 'G-HSYR9HXZF6',
});
// Enabling Offline Capability
firebase.firestore().settings({
  cacheSizeBytes: firebase.firestore.CACHE_SIZE_UNLIMITED,
});
firebase.firestore().enablePersistence();
// Listen to when a user logs in or logs out
firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    const userDetails = {
      id: user.uid,
      name: user.displayName,
      email: user.email,
      provider: user.providerData[0].providerId,
    };
    console.log(userDetails)
  } else {
    console.log('No User Found')
  }
});

Error: Firebase: No Firebase App '[DEFAULT]' has been created

3 Answers3

Linked