如何正确使用onSnapshot在Vuex4中的防火墙？

Question

我尝试在我最新的vue3.js网络应用中使用防火墙。我在我的应用程序中使用了vuex4作为sate管理。我的应用程序还使用firebase身份验证作为登录、注销和创建新用户。

我的应用程序在登录后使用snapShot函数，但出现了如下错误。

Uncaught Error in snapshot listener: FirebaseError: Missing or insufficient permissions.

但是，在注销事件之后，我已经将代码取消订阅onSnapshot函数。我的代码如下：

存储/index.js

const store = createStore({
 state: {
  unsubscribe: null,
 },
 actions: {
  startListner(context) {
   context.state.unsubscribe = onSnapshot(
      //something result get proccess
   )
  },
  stopPostsListner(context) {
      context.state.unsubscribe();
    },
 }
})

我将onSnapshot函数作为vuex操作方法。然后在index.vue中使用这些函数。

index.vue

<script setup>
import { useStore } from "vuex";
import { onMounted, onUnmounted } from "vue";
const store = useStore();

onMounted(() => {
  store.dispatch("startPostsListner");
});
onUnmounted(() => {
  store.dispatch("stopPostsListner");
});
</script>

我认为onSnapshot函数在销毁组件后取消订阅，但错误仍在发生。

如何正确地在onSnapshot中使用vuex4？

Answer 1

张贴我的评论，作为一个更好的能见度的答案。

从安全规则中更改：

allow read, write: if

从false;到true;将有助于修复错误。