Cloud Firestoreでデータの操作（追加、更新、削除、取得）

Googleのモバイルプラットフォーム「Firebase」で使うことができるデータベース「Cloud Firestore」のデータ操作方法について、ウェブ版（JavaScript）の基本的なものをメモしておきます。

Cloud Firestoreにアクセスしてデータの操作を行うために、まず、以下の外部JSファイルを参照します。

<script src="https://www.gstatic.com/firebasejs/7.8.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.8.2/firebase-firestore.js"></script>

続いて、Firebaseの設定で「APIキー」と「プロジェクトID」を指定します。

firebase.initializeApp({
  apiKey: '### FIREBASE API KEY ###',
  projectId: '### CLOUD FIRESTORE PROJECT ID ###'
});

var db = firebase.firestore();

データベースのセキュリティルールは「テストモード」ですべてのユーザーがデータを読み書きできる前提とします。

準備は以上で終わり。

なお、Firestoreは「コレクション」が「テーブル」、「ドキュメント」が「レコード（データ）」という位置付けになります。最初は『ドキュメントってなによ...』という感じでしたが、使っていればすぐに慣れます。

「products」というコレクションにデータ（ドキュメント）を追加する場合、「add」を使って以下のようにします。

function createProduct() {
  db.collection("products").add({
    name: "sample product",
    created_at: firebase.firestore.FieldValue.serverTimestamp(),
    updated_at: firebase.firestore.FieldValue.serverTimestamp()
  })
  .then(function (doc) {
    console.log("Document create with ID: ", doc.id);
  })
  .catch(function (error) {
    console.error("Error creating document: ", error);
  });
}

「firebase.firestore.FieldValue.serverTimestamp()」は指定することでサーバ側のタイムスタンプが登録されます。クライアント側の日時がいいのであれば「new Date()」に置き換えます。

事前にFirebaseのコンソールからコレクション「products」を追加しておく必要はありません。データを登録したタイミングでコレクションが自動で追加されます。

指定したフィールドのみ更新する場合は「update」を使います。

function updateProduct() {
  db.collection("products").doc("xxxxxxxxxx").update({
    name: "sample product 2",
    updated_at: firebase.firestore.FieldValue.serverTimestamp()
  })
  .then(function() {
    console.log("Document successfully updated!");
  })
  .catch(function(error) {
    console.error("Error updating document: ", error);
  });
}

doc()で指定している「xxxxxxxxxx」には、更新したいデータ（ドキュメント）のIDを指定します。

すべてのフィールドを上書きする（差し替える）場合は「set」を使います。

function setProduct() {
  db.collection("products").doc("xxxxxxxxxx").set({
    name: "sample product 2",
    created_at: firebase.firestore.FieldValue.serverTimestamp(),
    updated_at: firebase.firestore.FieldValue.serverTimestamp()
  })
  .then(function() {
    console.log("Document successfully updated!");
  })
  .catch(function(error) {
    console.error("Error updating document: ", error);
  });
}

「update」と「set」で更新の動作が違うのでコピペには気を付けましょう。

データ（ドキュメント）を削除する場合は「delete」を使います。

function deleteProduct(){
  db.collection("products").doc("xxxxxxxxxx").delete().then(function(){
    console.log("Document successfully deleted!");
  })
  .catch(function(error) {
    console.error("Error deleting document: ", error);
  });      
}

特定（単一）のデータを取得する場合、データ（ドキュメント）のIDを指定して「get」します。

function getProduct() {
  db.collection("products").doc("xxxxxxxxxx").get().then((doc) => {
    if (doc.exists) {
      console.log(doc.id);
      console.log(doc.data());
    } else {
      console.log("data is not found.");
    }
  })
  .catch(function (error) {
    console.error("Error getting document: ", error);
  });
}

get()がエラーの時と、指定したIDのデータが存在しない場合で分岐が異なるので注意。

全データを取得する場合は以下の通りです。

function getProducts() {
  db.collection("products").get().then((docs) => {
    docs.forEach((doc) => {
      console.log(doc.id);
      console.log(doc.data());
    });
  })
  .catch(function (error) {
    console.error("Error getting document: ", error);
  });
}

条件を指定してデータを絞り込む場合は「where」を使います。

function getProducts() {
  db.collection("products")
        .where("price", ">=", 100).where("price", "<", 500)
        .get().then((docs) => {
    docs.forEach((doc) => {
      console.log(doc.id);
      console.log(doc.data());
    });
  })
  .catch(function (error) {
    console.error("Error getting document: ", error);
  });
}

• Cloud Firestore を使ってみる  |  Firebase
• Cloud Firestore にデータを追加する  |  Firebase
• Cloud Firestore で単純なクエリと複合クエリを実行する | Firebase
• [Firebase] Firestoreで読み書きする (Web編)