vue.js - VueJS + Firestore- 自动保存投票

Question

我有一个类似于堆栈溢出的网站，用户可以在其中上下投票。我的问题是如何在 Vuejs/Firestore/VUEX 架构下有效地将这些信息保存到 firestore？stackoverflow/reddit 等其他网站如何处理这个问题？

我不想直接在点击时保存，因为 Firestore 按写入收费，并且用户很容易连续多次切换向上/向下投票。我还有一些会触发的云功能，每一个都需要时间来完成。

我看到了一些替代方案。一旦投票，我可以设置一个 2 秒的计时器间隔，如果它在那段时间内没有改变，则将其提交到 firestore。当用户离开页面太快并且在测试了几个更大的站点之后，这种方法的质量似乎较低，这有一个缺点。

另一种选择是使用 VUEX 保存页面刷新/退出。尽管我为此找到的解决方案似乎依赖于使用窗口对象，但如果/当我在我的应用程序中实现 SSR 时，我听说它可能无法正常工作。

也许有一个内置的解决方案？

标签： vue.jsvuejs2google-cloud-firestorevuexautosave

Answer 1

保护后端免受恶意用户攻击的一种常用方法是对某些事件添加速率限制。在您的情况下，赞成/反对投票事件。

你的第一种方法

您提到的非常接近速率限制的工作方式。只是在用户单击后2 秒触发事件到 firestore并且没有任何更改，您也可以立即触发事件，然后阻止任何事件 2 秒。这样，用户可以在 2 秒内离开页面，并且赞成/反对票仍将保留在您的数据库中。

你的第二种方法

这实际上是我从未尝试过的一些方法，但只是因为您已经提到了与 SSR 结合使用的潜在问题以及将其保存到临时本地状态的复杂性，这让我认为这种方法可能不值得工作。

示例解决方案

我从 github 问题评论中复制了这个，以 jsfiddle 为例：

您可以使用规则 link to fiddle http://jsfiddle.net/firebase/VBmA来限制每个用户的速率

我们已经讨论过公开这些信息，但目前我们不公开配额、速率限制或计费指标。可能有比规则更好的方法来配置这些东西（主要用于 authN/Z、资源定义、类型验证）。对暴露它们的担忧是不同配置文件（firestore.quota、firestore.billing、firestore.rules 等）的扩散，这会不必要地混淆用户。

问题： https ://github.com/firebase/firebase-js-sdk/issues/647#issuecomment-380303400