🌱
【Flutter】Firebase Cloud Storage導入後、画像アップロードが実行できない
背景
元々、Firestore, Firebase Authを使用していたプロジェクトにFirebase Cloud Storageを導入後、画像のアップロード処理を実装した際、画像アップロードに失敗した。
該当コード
upload_image.dart
/*
* 省略
*
*/
try {
final uploadTask = postImageRef.putData(
imageBitmap, // Uint8Listの画像データ
SettableMetadata(
contentType: 'image/jpeg',
),
);
//調査用
uploadTask.snapshotEvents.listen((event) {
// ↓ upload stateがerrorになっていることは確認できたが、原因が捕捉できない
print('Upload state: ${event.state}');
if (event.state == TaskState.error) {
print(event.hashCode);
}
});
/*
* 以降の処理が実行されない
*/
// imageUrlを取得
final imageUrl = await (await uploadTask).ref.getDownloadURL();
print('download用URL: $imageUrl');
return Result.success(imageUrl);
} on FirebaseException catch (e) {
print('error発生 : ${e.code}');
return Result.failure(e.toString());
}
}
試したこと・確認したこと
- Cloud Storageの権限確認 → 読み込み、書き込みアクセス許可を確認済み
- 公式ドキュメント通り、putFile, putDataメソッドで書き込み処理を実行するも、アップロードされない。しかも、例外がキャッチされない。
→upload処理の状態を捕捉したところ、エラーになっていることは確認できたが、例外として処理されておらず、原因が掴みきれない。 - コンソールから使用状況を確認したところ、書き込み数が増えていないため、リクエスト自体が届いていないことがわかった。(権限、もしくは設定の問題)
解決策
リクエスト自体が届いていないことから、おそらく設定漏れと仮定し、Firebase導入時の初期設定を再度行うことにした。
FlutterFire CLI からFirebaseとの接続を最新化
以下のコマンドを実行
flutterfire configure
firebase.jsonの上書きを行う。
参考)各項目は以下の記事を参考にさせていただきました。
Firebase再接続後
firebase_options.dartのstorageBucketがfirebasestorage.appで更新されていることが確認できた。
これで動くはず、、、
結果
firebase再接続後、flutter runで再度ビルド実行。
画像がアップロードされていることが確認できた!
気づき
Firebaseを初期導入後、サービスを追加した場合や設定を変更した場合には "flutterfire configure" を実行して、firebaseの接続情報を最新化することを忘れない様にしたいと感じました。
firebaseに関わらず、初期設定から変更した場合は影響範囲を考えながらエラーの可能性を探っていきたいですね。
Discussion