Cloud Firestoreのデータ取得で複数のフィールドで並べ替え（OrderBy）を行う際の注意点

Cloud Firestoreで複数のフィールドをOrderByで指定すると、エラーが発生して実行できなかったので、その時に対応した内容のメモになります。

Firestoreで複数のフィールドを使って並び替えを行う場合、以下のように、orderBy()をフィールド数分、呼び出して使います。

const db = firebase.firestore() 
const scoresRef = db.collection('scores')

scoresRef
  .orderBy('score', 'desc')
  .orderBy('created', 'asc')
  .limit(15)
  .get()
  .then(function(qs){
    console.log('success')
  })

Firebaseの公式のドキュメントにも上記のように書いてあったので、問題ないものと思っていましたが、このままではエラーが発生して、データを取得することが出来ません。

発生したエラーの内容は以下の通りです。

FirebaseError: The query requires an index. You can create it here: https://console.firebase.google.com/v1/r/project/project-name/firestore/indexes?create_composite=xxxxxxxxxx
    at new n (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:367:19)
    at t._e (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:3950:16)
    at t.Ze (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:4314:195)
    at n.onMessage (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:10349:33)
    at eval (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:10299:26)
    at eval (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:10334:37)
    at eval (webpack-internal:///./node_modules/@firebase/firestore/dist/index.cjs.js:5023:31)

最初はなんでエラーが出るのかさっぱりでしたが、エラーメッセージをよく確認すると、インデックスが必要と指摘されていることが分かります。

エラーメッセージの中にインデックス作成用のリンクが出力されているのですが、私の場合、このリンクからは作成できなかったので、手動で作成することにしました。

Firestoreでインデックスを作成するには、Firebaseコンソールにアクセスして、左側メニューから「Database」を選択し、表示されたページにある複数のタブから「インデックス」を選択します。

複合インデックスの右下にある「インデックスを作成」ボタンを押すと、「複合インデックスの作成」ダイアログが開きます。

ダイアログで作成したいインデックスのコレクションとフィールド（複数）を指定し、

最後にクエリのスコープを選択したら、右下のインデックスを作成ボタンを押します。

作成した複合インデックスが有効になるまで少し時間がかかるので（今回は1～2分ほど）、しばらく待って、ステータスが有効になったことを確認します。

上記の手順でインデックス作成後、最初に掲載したコードを実行すると、エラーが発生せずに正常にデータを取得することができました。

• Cloud Firestore でのデータの並べ替えと制限 | Firebase
• Firestoreでwhereでしているフィールドとorderbyしたいフィールドが違うので複合インデックスを作る - Qiita