firestoreを使っていてundefinedの値を保存しようとするとエラーが起きる事があります。
FirebaseError: Function setDoc() called with invalid data.
Unsupported field value: undefined (found in document xxxxxxxx)「undefinedは使わず、プロパティ自体削除するか、明示的にnullを入れてね」
というFirebase側の意図というのは理解しつつも、
「undeifned許容させてパパッとアプリケーション作っちゃいたい！」というケースは往々にしてありますよね。笑
この記事ではfirestoreで値を保存する際にundeifnedを許容する方法を記載します。
なお、使用するfirestoreはv9です。
検証した環境
| 1 | firebase | 9.9.4 |
firestoreで保存時にundefinedを許容する
結論としては ignoreUndefinedProperties を設定します
変更前
import { initializeApp, getApps, FirebaseApp, FirebaseOptions } from 'firebase/app'
import { getFirestore, Firestore } from 'firebase/firestore'
export const firebaseConfig: FirebaseOptions = {
・・・
}
const firebaseApp = initializeApp(firebaseConfig)
const firestore = getFirestore()変更後
import { initializeApp, getApps, FirebaseApp, FirebaseOptions } from 'firebase/app'
import { getFirestore, Firestore, initializeFirestore } from 'firebase/firestore'
export const firebaseConfig: FirebaseOptions = {
・・・
}
const firebaseApp = initializeApp(firebaseConfig)
initializeFirestore(firebaseApp, {
ignoreUndefinedProperties: true,
})
const firestore = getFirestore(firebaseApp)やる事は大きく2点
initializeFirestoreを使って firebaseApp にignoreUndefinedPropertiesを設定getFirestore()に firebaseApp を渡す
getFirestore() は以下のように定義されているので firebaseApp を渡す事が出来るんですね！
export declare function getFirestore(): Firestore;
export declare function getFirestore(app: FirebaseApp): Firestore;この設定で冒頭のエラーが起きなくなります。
ignoreUndefinedPropertiesについて
ignoreUndefinedProperties: true を設定した場合、
undefinedの値はfirestoreに書き込まれません。
例えば、以下のような値を保存しようとすると
{
firstName: "sample",
lastName: undefined
}firestore上には
{
firstName: "sample",
}のみ保存されているイメージですね。
firestore v8の資料になりますが、
[DeepL翻訳]
ignoreUndefinedProperties: boolean
オブジェクトのシリアル化中に未定義に設定されているネストされたプロパティをスキップするかどうか。trueに設定すると、これらのプロパティはスキップされ、Firestoreに書き込まれません。falseに設定されているか、または省略されている場合、SDKはundefinedタイプのプロパティに遭遇すると例外をスローします。
Settings | JavaScript SDK | Firebase JavaScript API reference より引用
「これらのプロパティはスキップされ、Firestoreに書き込まれません」
と書かれている通りスキップされるようになります！
