技術記事

micomia株式会社の畑井です。
今回はFlutterFlowでFirebaseに接続し、アプリを作る時にさらに実装の幅を広げてくれるRead Documentをご紹介します。

簡単に紹介すれば、リファレンスをセットするとドキュメントの中身を取得してくれるものになります。

1.Firebaseと接続する

FirebaseのProject IDをお見せすることができないので途中で画像を切っていますがProject IDが表示され、接続されていることを確認してください。

2025年9月28日現在のFlutterFlowの仕様ではFirebaseをBlazeにアップグレードしないとFlutterFlow側でStorageエラーが出ますが、それは画像等をアップロードできないだけでTestModeなどは利用できます。

2.ActionsからRead Documentを選択する

Buttonなどを画面に配置して、ActionsからAction Flow Editorを開いてください。Firebaseに接続している状態になると画像のような「Read Document」というものを選ぶことができると思います。
これが今回の本題となる機能になっています。
このアクションの考え方は「リファレンスをセットしてドキュメント情報を取得」になります。

画像右側のメニューを確認してください。
Select Reference to ReadというところがUNSETになっていると思います。

ここに読みたい(表示させたい)ドキュメントのリファレンスをセットしてあげることでそのドキュメントを再取得することが可能です。
リファレンスしかないけどドキュメントの中身を取得したいとか、再読み込みして最新のドキュメント情報を表示させたい時に利用できます。
最後にAction Output Variable Nameに名前をつけてあげれば完成です。

ここで定義したアクションの結果はAction Outputsからアクセスできますので確認してみてください。

3.動画でも解説しています

少し前にはなりますが、動画でも解説しているのでこちらも参考にしてみてください。こちらのチャンネルではFlutterFlowの動画を300本以上アップしています。

動画でもっと知りたい方はこちら