Cloud Functions for Firebaseを使用して、タスク更新時に"最近の更新"へデータを追加する (STEP 3 : 他のユーザのタスクが見れるタスク管理アプリを作成する - React + Redux + Firebase チュートリアル)

★前回の記事

yucatio.hatenablog.com

引き続き、addRecentUpdateOnUpdateCompletedを実装します。タスクが更新された時に、/recentUpdatedTodosにデータを追加します。

タスク更新時に"最近の更新"へデータを追加する

addRecentUpdateOnUpdateCompletedの処理は、addRecentUpdateOnCreateとほぼ同様です。textの取得処理を追加します。

functions/index.js

exports.addRecentUpdateOnUpdateCompleted = functions.database.ref('/todos/{uid}/{todoId}/completed')
  .onUpdate((change, context) => {
    const todoId = context.params.todoId;
    const uid = context.params.uid;
    let text;

    return change.after.ref.parent.child('text').once('value').then((snapshot) => {  // #1
      text = snapshot.val();
      return admin.database().ref('/users/' + uid + '/displayName').once('value');
    }).then((snapshot) => {
      const displayName = snapshot.val();
      return (admin.database().ref('/recentUpdatedTodos/' + todoId).set({
        uid,
        displayName,
        text,
        eventType: 'UPDATE',
        _updatedAt: admin.database.ServerValue.TIMESTAMP
      }));
    });
})

• change.after.refで更新後の値へのreferenceを取得します。parentで親ノードを取得し、さらにchild('text')でtextノードを取得します(#1)。

動作確認

デプロイして動作確認します。

$ cd todo-sample
$ firebase deploy --only functions

タスクの完了フラグを切り替えます。

データベースのデータを確認します。

/recentUpdatedTodosにtodoIdをキーとして、uidとdisplayName、text、eventType('UPDATE')、更新時間(_updatedAt)が追加されました。

リファクタリング

/recentUpdatedTodosへの書き込みは、タスクの作成・更新で共通なので、共通部分を関数として切り出します。

functions/index.js

const addRecentUpdate = (uid, todoId, text, eventType) => {
  return admin.database().ref('/users/' + uid + '/displayName').once('value').then((snapshot) => {
    const displayName = snapshot.val();
    return (admin.database().ref('/recentUpdatedTodos/' + todoId).set({
      uid,
      displayName,
      text,
      eventType,
      _updatedAt: admin.database.ServerValue.TIMESTAMP
    }));
  });
}

exports.addRecentUpdateOnCreate = functions.database.ref('/todos/{uid}/{todoId}/text')
  .onCreate((snapshot, context) => {
    const uid = context.params.uid;
    const todoId = context.params.todoId;
    const text =  snapshot.val();

    return addRecentUpdate(uid, todoId, text, 'CREATE');
})

exports.addRecentUpdateOnUpdateCompleted = functions.database.ref('/todos/{uid}/{todoId}/completed')
  .onUpdate((change, context) => {
    const todoId = context.params.todoId;
    const uid = context.params.uid;

    return change.after.ref.parent.child('text').once('value').then((snapshot) => {
      const text = snapshot.val();
      return addRecentUpdate(uid, todoId, text, 'UPDATE');
    });
})

動作確認

デプロイして動作確認します。

$ cd todo-sample
$ firebase deploy --only functions

データを作成・更新してデータを確認します。

タスクの作成・更新ともに/recentUpdatedTodosへ正常にデータが作成されました。

以上でタスク作成・更新時に"最近の更新"へデータを追加する処理が完成しました。

★次回の記事

yucatio.hatenablog.com

★目次

yucatio.hatenablog.com