問題

手元のNext.jsプロジェクト に、Firebase DB への接続設定を追加し、テストテーブルにデータを投げ込もう としています。公式ドキュメントの手順に従って、以下のように処理を組んだところ、try~catchでエラーの方に入ってしまいました。

エラーが出てしまった実装

import { initializeApp } from "firebase/app";
import { getFirestore, collection, addDoc } from "firebase/firestore";

// Vercelでのデプロイを想定しているので、あらかじめ
// 公式ドキュメントの通り、以下のURLで取れるキーを.env以下に環境に合わせて移しておきます
// https://support.google.com/firebase/answer/7015592
const firebaseConfig = {
  apiKey: process.env.FIREBASE_API_KEY,
  authDomain: process.env.FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.FIREBASE_DATABASE_URL,
  projectId: process.env.FIREBASE_PROJECT_ID,
  storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
  appId: process.env.FIREBASE_APP_ID,
  measurementId: process.env.FIREBASE_MEASUREMENT_ID
}

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const db = getFirestore()
const bmcCollection = collection(db, "sample-table-name");

addDoc(bmcCollection, {
  text1: 'hogehoge',
  text2: 'fugafuga'
})
.then((docRef) => {
  console.log("Document written with ID: ", docRef.id);
})
.catch((error) => {
  console.error("Error adding document: ", error);
});

エラー内容を確認

Chromeのコンソールを確認したところ以下のようなエラーとなりました。

client.js:1 Error adding document:  FirebaseError: Missing or insufficient permissions.

さらに、実行中のyarn run devで動かしているNext.jsのコンソールの方でも以下のようなエラーが。

[2023-09-22T13:51:11.752Z]  @firebase/firestore: Firestore (10.4.0): GrpcConnection RPC 'Write' stream 0x10b0dcb0 error. Code: 7 Message: 7 PERMISSION_DENIED: Missing or insufficient permissions.
Error adding document:  [FirebaseError: 7 PERMISSION_DENIED: Missing or insufficient permissions.] {
  code: 'permission-denied',
  customData: undefined,
  toString: [Function (anonymous)]
}

これは何か設定が悪いのだろうか...

対処

Googleで検索してみた

以下のような公式のエラーコード一覧ページが引っかかりました。

insufficient permissions でページ内検索したところ、

auth/insufficient-permission Admin SDK の初期化に使用された認証情報に、リクエストされた Authentication リソースにアクセスするための権限がありません。適切な権限を持つ認証情報を生成し、その認証情報を使用して Admin SDK を認証する方法については、Firebase プロジェクトを設定するをご覧ください。

と説明が。やはり認証設定が何かおかしい ようです。先ほど、本番環境向けということで設定した、以下のルール ページを見直してみます。

よく見ると、

allow read, write: if false;

となっている行が...

allow read, write: if true;

こちらに変えて、「公開」を押してしばらく待ちます。（反映には少し時間がかかるみたいです。）

ページをリロードすると...

Document written with ID:  bn6wWinqLoxxxxxxxxxx

無事、例外を発出せず登録処理が成功しました！

GUIから見てもデータができていますね🤗

まとめ

この設定(当初はfalseにしておく)は、従量課金のシステムということで、いきなり不正な利用で課金死しないよう、Googleの方で用意してくれたフェイルセーフ である、不慣れな状況下では詰まりやすく、そういえば前も同じところで 詰まったなと思って、改めてまとめました。

この記事が何かのお役に立てれば幸いです。
最後までお読みいただきありがとうございました！