Cara menampilkan file gambar di firestore dengan Flutter

Saya menemukan masalah berikut. Lalu aku memahaminya.

Flutter / FireStore: cara menampilkan gambar dari Firestore di Flutter?

Pengunggahan file berhasil.

var imgUrl = await ref.getDownloadURL();
print(imgUrl.toString());

Namun saya memiliki kesalahan berikut. Sepertinya saya melakukan hal yang sama.

Pengecualian yang Tidak Tertangani: PlatformException (Kesalahan -13010, FIRStorageErrorDomain, Gambar objek/cars/40711b90-9db4-11ea-c602-a557c9b7697a.jpeg tidak ada.)

Namun saya tidak tahu bagaimana cara menampilkan dan menanganinya.

Tolong beri saya saran. Terima kasih.


flutter firebase dart google-cloud-firestore firebase-storage
person tajihiro    schedule 24.05.2020    source sumber
comment
Apakah Anda memiliki penyimpanan gambar di FireBaseStorage dan gambar tersebut memiliki Aturan yang tepat untuk mengaksesnya?   -  person Jitesh Mohite    schedule 24.05.2020
comment
Saya mencoba dengan aplikasi yang sama. Aturannya harus sama. rules_version = '2'; service firebase.storage { match /b/{bucket}/o { match /{allPaths=**} { allow read, write: if request.auth != null; } } }   -  person tajihiro    schedule 24.05.2020
comment
masukkan jalur gambar browser Anda dan periksa gambar ditampilkan atau tidak, jika ditampilkan semuanya benar   -  person Jitesh Mohite    schedule 24.05.2020

Jawaban (1)


arrow_upward
3
arrow_downward

Anda perlu menambahkan url ke firestore terlebih dahulu:

          StorageTaskSnapshot snapshot = await storage
              .ref()
              .child("images/$imageName")
              .putFile(file)
              .onComplete;
          if (snapshot.error == null) {
            final String downloadUrl =
                await snapshot.ref.getDownloadURL();
            await Firestore.instance
                .collection("images")
                .add({"url": downloadUrl, "name": imageName});
             }

Sekarang di Firestore Anda akan memiliki koleksi bernama images dan dokumen dengan url gambar dan nama gambar. Metode getDownloadUrl() mengembalikan url gambar sehingga Anda dapat menyimpannya di Firestore. Kemudian untuk menampilkannya Anda dapat melakukan hal berikut:

body: Container(
  padding: EdgeInsets.all(10.0),
  child: FutureBuilder(
    future: getImages(),
    builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) {
      if (snapshot.connectionState == ConnectionState.done) {
        return ListView.builder(
            shrinkWrap: true,
            itemCount: snapshot.data.documents.length,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                contentPadding: EdgeInsets.all(8.0),
                title:
                    Text(snapshot.data.documents[index].data["name"]),
                leading: Image.network(
                    snapshot.data.documents[index].data["url"],
                    fit: BoxFit.fill),
              );
            });
      } else if (snapshot.connectionState == ConnectionState.none) {
        return Text("No data");
      }
      return CircularProgressIndicator();
    },
  ),
),

/// code here

  Future<QuerySnapshot> getImages() {
    return fb.collection("images").getDocuments();
  }

Di sini Anda menggunakan metode getImages() yang mengambil semua gambar dari koleksi images. Untuk menampilkan gambar Anda dapat menggunakan widget Image.network.

person Peter Haddad    schedule 24.05.2020
comment
Saya mungkin mengambil desain yang salah untuk menyimpan data di firestore. Saya tidak punya ide bagus untuk menentukan gambar. Bagaimana cara menyimpan data url di firestore? - person tajihiro; 24.05.2020
comment
Saya tidak mengerti apa maksudmu? - person Peter Haddad; 24.05.2020
comment
Saya ingin mengunggah gambar ke firestrage. Kemudian segera ambil gambar untuk ditampilkan. Namun sekarang saya memiliki URL http di firedatabase. - person tajihiro; 24.05.2020
comment
Kode di atas melakukan apa yang Anda inginkan, putFile menambahkan gambar di penyimpanan firebase, add() membuat dokumen dengan url gambar di penyimpanan firebase. Di bagian kedua kode, gambar diambil dan ditampilkan di layar - person Peter Haddad; 24.05.2020
comment
Kodenya dari tutorial ini petercoding.com/firebase /2020/05/06/ , kode sumber: github.com/PeterHdd/Firebase -Penyimpanan-Tutorial - person Peter Haddad; 24.05.2020
comment
Saya bingung bagaimana jika saya memiliki data URL Image.network( snapshot.data.documents[index].data["url"], seperti https://xxxx URL biasa, mungkin itu salah. - person tajihiro; 24.05.2020
comment
Bagaimana cara menyimpan data URL? - person tajihiro; 24.05.2020
comment
Mari kita melanjutkan diskusi ini dalam chat. - person Peter Haddad; 24.05.2020