angularfire: @firebase/database: FIREBASE WARNING: Exception was thrown by user callback. TypeError: Cannot read property 'myID' of undefined

Version info

Angular: ^5.2.0

Firebase: ^4.13.1

AngularFire: ^5.0.0-rc.6.0

Other (e.g. Node, browser, operating system) (if applicable): Firebase Hosting

Test case

getLocations(radius: number, coords: Array<number>) {
        this.geoFire.query({
            center: coords,
            radius: radius
        })
        .on('key_entered', (userKey, location, distance) => {
            
            const existAlready = this.hits.value.filter(h=>h.userKey === userKey)

            if(existAlready.length > 0){
                return
            }

            const u = this.userList.query.ref
                          .child(`/${userKey}`)
                          .on('value',s=>{
                            const {name, address} = s.val()
                            console.log(s.val())
                            let hit = {
                                location,
                                distance,
                                name,
                                address,
                                userKey
                            }
                            
                            let currentHits = this.hits.value
                            currentHits.push(hit)
                            this.hits.next(currentHits)
                            
                            this.eventService.sendMessage(Constants.EVENT_MESSAGES.LOADING, true)

                          })
        })
    }

Basically what i am doing is fetching the current location and passing it to the function above

Steps to reproduce

I am using angularfire with geofire for a location based app for fetching locations around my user. It works perfectly on my dev machine, but as soon as i build and deploy to firebase hosting, I get a very strange error

@firebase/database: FIREBASE WARNING: Exception was thrown by user callback. TypeError: Cannot read property ‘myID’ of undefined

What i am doing basically is fetching the current location and passing it to the function above, the function is meant to fetch nearby locations and then put them in a behavioursubject. It works well in development like a said, but its a big NO NO on the firebase hosting server.

Expected behavior

I expect to get back the locations around me saved in firebase.

Actual behavior

I am getting an error as stated above.

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 7
Comments: 33

Commits related to this issue

Hotfix for strange "Cannot read property 'myID' of undefined" error Details here: https://github.com/firebase/angularfire/issues/970 — committed to Methodician/flight.run by Methodician 6 years ago

Most upvoted comments

I have solved this issue. Just do this in your app.component.ts

constructor() {
    localStorage.removeItem('firebase:previous_websocket_failure');
}

This is a temporary solution, on network fluctuation it will throw same error

+19

mubashshirul on Jun 4, 2018

I ran into this issue today and it seemed to be related to having a logged in Firebase auth state. I pushed the same code to two different Firebase hosting projects and it worked on one and not the other. The site that worked was logged out. Once I clear cookies etc for the broken site and logged in again it started working.

safarmer on May 15, 2018

No official fix for this yet? It’s still alive even on a wrong GitHub project, since the problem is apparent when using only the JS Database / library.

zarko-tg on Jan 10, 2020

Not sure how you can be sure it’s not a problem with angularfire as the people reporting it all seem to be using angular - or at least I can’t find others experiencing this problem. I’m seeing the same problem as everyone else, only when compiled with --prod.

keith-nativemobile on May 23, 2018

I am having the same issue as well! In dev the code runs fine, once I switch to ng build --prod i get the following message when i run the app Cannot read property 'myID' of undefined

3lywa on May 14, 2018

@mubashshirul ‘s solution worked good, but error sporadically appeared not only on developer but on clients’ computers too. Now after using ng build --prod --build-optimizer=false everything is OK for more than a week.

This is working to our case. in our case removing the localstorage item didn’t help.

I changed from ng build --prod --aot --build-optimizer to ng build --prod --aot --build-optimizer=false

kingychiu on May 4, 2020

Same here with:

@angular       5.2.11
angularfire2   5.0.0-rc.7
firebase       4.13.1

After network disconnection and later reconnection, error starts popping up, and gathered data cannot be sent to Firebase anymore. As @mubashshirul says, proposed solution doesn’t work for network outages.

Downgrading to firebase#4.12.1 seems to solve the problem

aroncal on Jan 25, 2019

@mubashshirul ‘s solution worked good, but error sporadically appeared not only on developer but on clients’ computers too. Now after using ng build --prod --build-optimizer=false everything is OK for more than a week.

maxx-kl on Jul 10, 2018

Same issue here, it seems that if you delete Firebase’s cookies it will work, however once those are available it just starts spitting the error. Maybe that’s why many people reported it as an issue which is not always easily reproducible.

angelnikolov on May 31, 2018

Same problem …

kriefsacha on May 30, 2018

same here. works for the first time but when I close the browser and open the hosted site I get this error.

amam62 on May 16, 2018

Same problem for me, it throws the error for some users, and works for some other users.

benjamincombes on May 16, 2018