省エネ

Flutter、vue3修行中。

【Flutter】Firebase Storageに画像を保存する

こんにちは。
前回、写真を撮る機能をアプリに追加したのですが。

qkuronekop.hatenablog.jp

この撮った写真をFirebase Storageに保存したいと思います。

pubspec.yml

dependencies:
  flutter:
    sdk: flutter
  firebase_storage: 1.0.4

AndroidX関係でエラーになるので、下記のリンク先のバージョンに合わせます。

flutter.dev

import

import 'package:firebase_storage/firebase_storage.dart';

code

  Future<Null> uploadFile(String filePath) async {
    final ByteData bytes = await rootBundle.load(filePath);
    final Directory tempDir = Directory.systemTemp;
    final String fileName = "${Random().nextInt(10000)}.jpg";
    final File file = File('${tempDir.path}/$fileName');
    file.writeAsBytes(bytes.buffer.asInt8List(), mode: FileMode.write);

    final StorageReference ref = FirebaseStorage.instance.ref().child(fileName);
    final StorageUploadTask task = ref.putFile(file);
  }

こんな感じでファイルを作り、Firebase Strageにuploadします。

 RaisedButton(
   color: Colors.grey,
   shape: RoundedRectangleBorder(
     borderRadius: BorderRadius.all(Radius.circular(10.0)),
   ),
   child: Icon(Icons.camera),
   onPressed: () async {
     var filePath = await takePicture();
     if (mounted) {
       setState(() {
         imagePath = filePath;
       });
     }
     await uploadFile(filePath);
   },
 ),

前回作ったカメラ画面のシャッターボタンのonPressed()で、画像のパス取得後にuploadFile()を呼び出しています。

私のアプリの場合には、匿名ログインの機能を入れいているので、この状態で動作させることが可能です。

qkuronekop.hatenablog.jp

が、FirebaseAuthを入れていない場合にはデフォルトでwrite権限がないのでFirebase consoleのStorageメニューを選択し、ルールタブを開きアクセス権の変更をします。

f:id:qkuroneko:20190323074416p:plain

service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read, write;
    }
  }
}

ルールをこんな感じに変更します。
これでトークンがなくてもread、writeすることができます。
ちょっと機能を試してみたい場合にはこれでいいかと思います。

こちらを参考にしました。

www.youtube.com