Firebase rules issues (data retrieved even if Client doesn't have permission to access data)

Here is my code (my Vue component created hook):

data () {
    return {
      users: []
    }
  },
created () {
    this.$watch('currentUser', (currentUser) => {
      if (currentUser) {
        firebase.database().ref('users').once('value').catch(error => {
          console.log(error)
        })
        this.$bindAsArray('users', firebase.database().ref('users'))
      }
    }, {
      immediate: true
    })
  }

firebase.database().ref('users').once('value') displays an error in my console :

Error: permission_denied at /users: Client doesn't have permission to access the desired data.
    at Object.exports.errorForServerCode (webpack-internal:///./node_modules/@firebase/database/dist/cjs/src/core/util/util.js:513)
    at onComplete (webpack-internal:///./node_modules/@firebase/database/dist/cjs/src/core/SyncTree.js:538)
    at Object.eval [as onComplete] (webpack-internal:///./node_modules/@firebase/database/dist/cjs/src/core/Repo.js:115)
    at eval (PersistentConnection.js?2227:180)
    at PersistentConnection.onDataMessage_ (PersistentConnection.js?2227:435)
    at Connection.onDataMessage_ (Connection.js?da35:262)
    at Connection.onPrimaryMessageReceived_ (Connection.js?da35:256)
    at WebSocketConnection.eval [as onMessage] (Connection.js?da35:157)
    at WebSocketConnection.appendFrame_ (WebSocketConnection.js?1357:197)
    at WebSocketConnection.handleIncomingFrame (WebSocketConnection.js?1357:247)

It’s normal, cause I set my Firebase rules “.write” and “.read” to “false” for this path (“/users”).

So, I should not be able to retrieve the data, right ?

But this.$bindAsArray('users', firebase.database().ref('users')) retrieve the data, so it doesn’t care about Firebase Security rules. I checked the Vuefire source code, and the only solution I found was to use the cancelCallback as following :

this.$bindAsArray('users', firebase.database().ref('users'), () => {
     this.$unbind('users')
     this.users = []
   })

But it can’t be right, cause there is like one or less than one second where the data is retrieved and bound to “users” (The “users” array backs to an empty array only when the cancelCallback is called), so if I display the “users” property of my Vue instance, there is a time where the users are displayed, even if the current user logged in ( using Firebase Auth) doesn’t have permission to retrieve data from the “/users” path of my Firebase RealTime Database.

Is there any fix to never retrieve the data if the client doesn’t have permission to access the desired data ?

Thanks in advance.

[kevinmarrec]

OK ! I solved the issue by myself, testing with the two following rules and 2 users in my Database :

{
  "rules": {
    "users": {
      ".read": false,
      ".write": false,
      "$uid": {
        ".read": true,
        ".write": true
      }
    }
  }
}

-> Result : users are retrieved but only with one user, the current user logged in (checked with uid automatically by Firebase) !

{
  "rules": {
    "users": {
      ".read": true, // ALLOWS TO GET ALL USERS
      ".write": false,
      "$uid": {
        ".read": true,
        ".write": true
      }
    }
  }
}

-> Result : all users are retrieved

So : I didn’t know that using “$uid” with Firebase rules automatically bound a new rule which allows to get his parent (‘/users’) data, even if “.read” is set to false, but only for itself (only User 1 if $uid = 1)

[posva]

Thanks for posting back your results 😉