onSnapshot에서 검출되지 않은 오류: 오류: signOut()에 대한 권한이 없거나 부족합니다.

onSnapshot에서 검출되지 않은 오류: 오류: signOut()에 대한 권한이 없거나 부족합니다.

vuex와 firebase를 사용하여 vuegram의 지시에 따라 사용자 인증을 구현하고 있습니다.파이어베이스 청취자를 분리하기 위해 여러 가지 방법을 시도했지만 경고 오류를 멈추는 유일한 방법은 다음과 같습니다.

var unsubscribe=fb.auth.onAuthStateChanged(user=>{
    if(user){
        store.commit('setCurrentUser',user)
        store.dispatch('fetchUserProfile')

        fb.usersCollection.doc(user.uid).onSnapshot(doc => {
            store.commit('setUserProfile', doc.data())
        })
    }
})
unsubscribe();

그러나 위의 코드는 signOut()의 경고를 중지하기만 하면 데이터를 업데이트할 수 없습니다.

my store.js 파일:

var unsubscribe=fb.auth.onAuthStateChanged(user=>{
    if(user){
        store.commit('setCurrentUser',user)
        store.dispatch('fetchUserProfile')

        fb.usersCollection.doc(user.uid).onSnapshot(doc => {
            store.commit('setUserProfile', doc.data())
        })
    }
})

export const store=new Vuex.Store({
    state:{
        currentUser:null,
        userProfile:{}
    },
    actions:{
        clearData({commit}){
            commit('setCurrentUser',null)
            commit('setUserProfile', {})
        },
        fetchUserProfile({ commit, state }) {
             fb.usersCollection.doc(state.currentUser.uid).get().then(res => {
                commit('setUserProfile', res.data())

            }).catch(err => {
                console.log(err)
            })
        },
        updateProfile({ commit, state }, data) {
            let displayName = data.displayName

            fb.usersCollection.doc(state.currentUser.uid).set({
                displayName: displayName
            }, {merge:true}).then(function() {
                alert("Document successfully written!");
            })
            .catch(function(error) {
                alert("Error writing document: ", error);
            });
        }
    },
    mutations:{
        setCurrentUser(state, val) {
            state.currentUser = val
        },
        setUserProfile(state, val) {
            state.userProfile = val
        }
    }
})

signOut 메서드:

signOut: function(){
        fb.auth.signOut().then(()=> {
            this.$store.dispatch('clearData')
            this.$router.push('login')
        }).catch(function(error) {
            console.log(error);
        });
    }

파이어베이스 규칙:

allow read, write: if request.auth.uid!=null;

로그아웃 시 액티브한 리스너가 아직 존재하기 때문에 클라이언트는 그 데이터를 읽을 수 있는 권한을 상실했음을 검출하고 리스너를 거부합니다.즉, 로그아웃하기 전에 수신기를 삭제하여 오류 메시지를 방지해야 합니다.

청취자 분리 매뉴얼을 참조해 주세요.청취자를 연결하면 먼저 수신 해제 함수에 대한 참조가 제공됩니다.

unsubscribe = fb.usersCollection.doc(user.uid).onSnapshot(doc => {
    store.commit('setUserProfile', doc.data())
})

그런 다음 로그아웃하기 전에 해당 함수를 호출합니다.

signOut: function(){
    unsubscribe();
    fb.auth.signOut().then(()=> {
        this.$store.dispatch('clearData')
        this.$router.push('login')
    }).catch(function(error) {
        console.log(error);
    });
}

많은 페이지에 로그아웃 버튼이 있는 경우 다른 페이지로 이동하여 로그아웃을 호출합니다.그럼 미확인범들로 코드를 어지럽히지 않아도 되겠네요

또, 다음의 정보를 확인할 수 있습니다.Firestore rules.

이것이 여기에 있는 경우:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if false;
    }
  }
}

변경 내용:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if true;
    }
  }
}

이는 안전하지 않으며 개발 목적으로만 사용됩니다.Firestore 규칙이 어떻게 작동하는지 이해하려면 이 유튜브 비디오를 보세요.

언급URL : https://stackoverflow.com/questions/53584888/uncaught-error-in-onsnapshot-error-missing-or-insufficient-permissions-on-sign