Firebase JS - 永久离线存储

Question

我正在使用Angular 2，Electron和Firebase开发应用程序。该应用主要是一个离线应用，可以选择在线时同步。问题是，目前，Firebase不支持浏览器上的永久存储。我想在离线时使用PouchDB并在连接时将其同步到Firebase。但是，我觉得需要付出太多努力才能使数据在两个数据库中保持一致。那么，Firebase应用程序的永久离线存储有哪些更好的选择？一个例子也非常棒。

Answer 1

AngularFire2Offline

我遇到了同样的情况，并创建了一个缓存只读AngularFire2数据的库，供离线使用。如果页面脱机加载，它将使用localstorage，并且在可用时将使用Firebase数据。

演示

• Angular 2+ Demo - tutorial
• Ionic 2+ Demo - tutorial

基本用法

1。安装

npm install angularfire2-offline angularfire2 firebase --save

2。成分

import { Component } from '@angular/core';
import {
  AngularFireOffline,
  ListObservable,
  ObjectObservable } from 'angularfire2-offline';

@Component({
  selector: 'project-name-app',
  template: `
  <h1>{{ (info | async)?.name }}</h1>
  <ul>
    <li *ngFor="let item of items | async">
      {{ item?.name }}
    </li>
  </ul>
  `
})
export class MyApp {
  info: ObjectObservable<any>;
  items: ListObservable<any[]>;
  constructor(afo: AngularFireOffline) {
    this.info = afo.database.object('/info');
    this.items = afo.database.list('/items');
  }
}

• 方法镜像object和list的AngularFire2数据库读取方法。
支持
• Querying lists

3。模块

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AngularFireModule } from 'angularfire2';
import { AngularFireOfflineModule } from 'angularfire2-offline';

import { AppComponent } from './app.component';

// Must export the config
export const firebaseConfig = {
  apiKey: '<your-key>',
  authDomain: '<your-project-authdomain>',
  databaseURL: '<your-database-URL>',
  storageBucket: '<your-storage-bucket>'
};

@NgModule({
  declarations: [AppComponent],
  imports: [
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFireOfflineModule.forRoot(),
    BrowserModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }