はじめに
Firestore のキャッシュ周りの備忘録です.
Firestore のキャッシュを有効にする
enablePersistence() というメソッドを実行することでオフラインキャッシュを有効にできます.
また, synchronizeTabs: true を渡すことで複数タブでもデータを同期してくれるようになります.
await firebase.firestore().enablePersistence({synchronizeTabs: true});
var db = firebase.firestore();
...
これでデータを取得するたびにデータをキャッシュするようになります.
キャッシュは indexedDB の remoteDocuments に溜まります.
Firestore のキャッシュからデータを取得する
キャッシュからデータを取得するには以下のように get 時に source:'cache' を指定します.
var user = await db.collection('users').doc(user_id).get({
source: 'cache',
});
console.log(user.metadata.fromCache); // true
ちゃんとキャッシュから取得できた場合, fromCache の値が true になります.
また, 初回はキャッシュがないのでエラーになってしまうケースがあります.
その場合の対策として最初に cache から取得し, 失敗時は try ~ catch で補足し改めて server で取得するという方法もあります.
var ref = db.collection('users').doc(user_id);
try {
this.user = await ref.get({
source: 'cache',
});
}
catch (e) {
this.user = await ref.get({
source: 'server',
});
}
キャッシュがあるときはキャッシュから, キャッシュがないときはサーバーからデータを取得するので, 確実にデータを取得できます.
Firestore のキャッシュをクリアする
clearPersistence() を実行すると indexedDB に溜まったキャッシュをクリアしてくれます.
firebase.firestore().clearPersistence();
var db = firebase.firestore();
...
firestore() を実行する前に clearPersistence() を実行しないとエラーが出るのでご注意ください.
おわりに
情報が少なかったので自分なりにまとめてみました.
この辺は, しょっちゅうインターフェースや引数の内容も変わるのでガッツリ使うのはまだ危険かもしれませんね.
Reference
Discussion