はじめに
Firestoreはバックエンドのコードを書くことなく、簡単にDBを扱えます。
バックエンド開発になれていない初心者だけでなく、プロトタイプを素早く作成したい人にもマッチする技術です。
しかし、クライアントから直接DBをいじることができる都合上、ユーザーが悪意のあるクエリを叩くことができてしまうということを知っておく必要があります。
対象者
この記事では上記のセキュリティルールが設定されているWebアプリから簡単にデータを抜き取れることを説明することで、セキュリティルールを書くことの大切さを伝えることが目的です。
手順
必要なのはブラウザだけです。この記事ではChromeを使うことを想定しています。
ログインする
セキュリティルールを見るとわかるように、ログインしないとすべてのクエリが弾かれるようになっています。とりあえず。サービスにログインしましょう
SDKを読み込む
devツールを開きましょう。Console
で以下のコマンドをうち、firebaseSDKを読み込みます。
> const script = document.createElement('script')
> script.src="https://www.gstatic.com/firebasejs/8.2.1/firebase.js"
> document.head.append(script)
バージョンの部分(8.2.1
)は適宜変更してください。現時点(2021/01/06)の最新バージョンは8.2.1
です。
firebaseConfigを抜き取る
devツールのSources
タブから、mainファイルっぽいjsを選択し、apiKey
で検索をかけると、firebaseConfigが抜き取れます。{"apiKey": "***", "authDomain": "***", ...}
となっている部分がfirebaseConfigです。
SDKの初期化
次に、抜き取ったfirebaseConfigを使ってfirebase sdkを初期化しましょう。devツールのConsole
タブで以下のコマンドを打ちます
firebase.initializeApp(/** 抜き取ったfirebaseConfig */)
さあ、準備は整いました。
自由にクエリを叩くことができます。
> const snap = await firebase.firestore().collection('users').get()
> snap.docs.map(doc => doc.data())
これで、usersコレクションのすべてのデータを見ることができてしまいます。DBの全データを閲覧・書き換え・削除することも可能です。
対策方法
firebase configを非公開にすることは現状無理です。つまり、firestoreのセキュリティルールをきちんと書くしかないです。
もしくは、firestoreのセキュリティルールをフロントからはアクセスできないようにして、functionsからのみアクセスできるようにするというのも考えられます(ただし、その場合はコールドスタートというパフォーマンス問題が発生し、対策が必要になります)。
結論
セキュリティルールはちゃんと書きましょう。
この記事を読んで冷や汗をかいた人は、まず公式ドキュメントを読みましょう。おすすめのドキュメントは以下です。