离线/在线数据同步在firestore - Laravel

Question

我正在尝试使用Laravel和vue.js开发一个web应用程序，即使我离线，我也可以从firestore同步数据。我在firestore的特性中看到它提供了这个特性。但我不知道如何把这个功能到我的项目。我已经克隆了suhasrkms/Laravel -with- Firestore在Laravel的Firestore。但我面临的主要问题是我不知道如何添加离线代码/持久性。我试图在firestore文档中提供的resources/js/offline-persistence.js中添加代码。我已经尝试在我的刀片文件中添加代码。
请提供给我解决方案，你的答复对我很有价值。

<script type="text/javascript">

firebase.firestore().enablePersistence()
.catch((err) => alert(Something failed for enablePersistence, code: ${err.code}));
firebase.firestore().collection('test')
.onSnapshot(snaps => {
if (snaps.empty) { return; }
const preDataElm = document.getElementById("preData");
while (preDataElm.firstChild) {
preDataElm.removeChild(preDataElm.firstChild);
}
let list = snaps.docs.map(snap => {
return {id: snap.id, ...snap.data()};
});
let newElm = document.createElement("PRE");
newElm.innerText = JSON.stringify(list, null, 2);
return preDataElm.appendChild(newElm);
});
function tryMe() {
document.getElementById("result").innerHtml = "";
firebase.firestore()
.collection('test')
.add({test: new Date().toString()})
.then((docRef) => alert(Data inserted successfuly ID: ${docRef.id}));
}
</script>

Answer 1

要添加脱机代码/持久性，您需要在初始化Cloud Firestore时启用或禁用脱机持久性，如文档中所述:

• 对于Android和iOS，默认启用离线持久化。要禁用持久化，请将PersistenceEnabled选项设置为false。

• 对于web，默认禁用离线持久化。要启用持久性，请调用enablePersistence方法。Cloud Firestore的缓存不会在会话之间自动清除。因此，如果您的web应用程序处理敏感信息，请确保在启用持久性之前询问用户是否在受信任的设备上。

您还可以参考stackoverflow case1和case2，其中OP遇到了类似的问题，通过将持久性设置为:

FirebaseDatabase.getInstance().setPersistenceEnabled(true);