Bir Firebase uygulamasında Cloud Storage'daki tüm dosyaların bir listesini nasıl alabilirim?


102

Resim yüklemek için çalışıyorum, her şey harika çalışıyor, ancak 100 resmim var ve hepsini Viewbir klasördeki resimlerin tam listesini aldığım için bende göstermek istiyorum, bunun için herhangi bir API bulamıyorum iş.


Tam bir kod çözümü gönderebilir misiniz?
ISS

Yanıtlar:


92

JavaScript 6.1 sürümü , iOS 6.4 sürümü ve Android sürüm 18.1 için Firebase SDK'larının tümü dosyaları listelemek için bir yönteme sahiptir.

Dokümantasyon ben kontrol öneriyoruz, böylece seyrek şimdiye kadar biraz Rosario cevabını detayları için.


Önceki cevap, çünkü bu yaklaşım bazen hala yararlı olabilir:

Şu anda Firebase SDK'da, bir uygulamanın içinden Cloud Storage klasöründeki tüm dosyaları listelemek için bir API çağrısı yoktur. Bu tür bir işlevselliğe ihtiyacınız varsa, dosyaların meta verilerini (indirme URL'leri gibi) listeleyebileceğiniz bir yerde saklamalısınız. Firebase Gerçek Zamanlı Veri Tabanı ve Bulut Firestore bunun için idealdir ve ayrıca kolayca başkalarıyla URL'leri paylaşmalarını sağlar.

FriendlyPix örnek uygulamamızda bunun iyi (ancak biraz ilgili) bir örneğini bulabilirsiniz . Web sürümü için ilgili kod burada , ancak iOS ve Android için de sürümler var.


8
Bunu Firebase'de uygulayacak mısınız?
İskele

55
Tüm Depolama dosyalarımın URL'lerini Gerçek Zamanlı Veritabanında tutmam gerekirse, Depolama'da klasör hiyerarşisine sahip olmanın amacı nedir? benzersiz ada sahip tüm dosyalar aynı seviyede saklanabilir, klasörlere gerek yoktur !!! görüyorsun, bu bir çelişki !!! Temel olarak, klasör hiyerarşisinin arkasındaki ana mantık, bir klasörde neye sahip olduğunuza dair önceden bilgi sahibi olmadan joker karakter sorgularıdır ve bunu makul bir şekilde sağlamazsınız.
abedfar

7
Firebase Storage, tam olarak ne söylediğinizi yapan Google Cloud Storage üzerine inşa edilmiştir: tüm nesneleri tek bir uzun listede depolar. Firebase Storage, kuşkusuz sızdıran bir soyutlama olarak bunun üzerine bir hiyerarşi modeller. Firebase Storage'da klasör kullanmanın yaygın nedenleri, mantıksal veri ayırma ve klasör yapısına dayalı güvenlik kuralları oluşturmaktır.
Frank van Puffelen

8
Yüklemeden sonra ve downloadUrl'yi veritabanına kaydetmeden önce kullanıcı bağlantısı kesilirse ne olur? Bu durumda bir klasördeki mevcut dosyaları nasıl keşfederiz?
Oswaldo

10
Şimdi ne olacak? 2018'de bunun için herhangi bir doğrudan API var mı?
Diaz diaz

48

Mayıs 2019 itibarıyla, Cloud Storage için Firebase SDK'nın 6.1.0 sürümü artık bir paketteki tüm nesneleri listelemeyi desteklemektedir. Sadece çağırmanız gerekir listAll()bir de Reference:

    // Since you mentioned your images are in a folder,
    // we'll create a Reference to that folder:
    var storageRef = firebase.storage().ref("your_folder");


    // Now we get the references of these images
    storageRef.listAll().then(function(result) {
      result.items.forEach(function(imageRef) {
        // And finally display them
        displayImage(imageRef);
      });
    }).catch(function(error) {
      // Handle any errors
    });

    function displayImage(imageRef) {
      imageRef.getDownloadURL().then(function(url) {
        // TODO: Display the image on the UI
      }).catch(function(error) {
        // Handle any errors
      });
    }

Bu işlevi kullanmak için, güvenlik kurallarınızın ilk satırını oluşturarak yapılabilecek Güvenlik Kuralları sürüm 2'yi seçmeniz gerektiğini lütfen unutmayın :rules_version = '2';

    rules_version = '2';
    service firebase.storage {
      match /b/{bucket}/o {
        match /{allPaths=**} {

Daha fazla referans için dokümanlara bakmanızı tavsiye ederim .

Ayrıca, kuruluma göre , Adım 5'te, bu betiğe izin verilmiyor Node.jsçünkü işlev olarak require("firebase/app");geri dönmeyecek firebase.storage(). Bu sadece kullanılarak elde edilir import * as firebase from 'firebase/app';.


hangi eklentiyi kullanıyorsunuz
azheen

@azheen Flutter kullandığınızı varsayıyorum. Ne yazık ki, bu henüz flutterfire'da mevcut değil. Bu sayıda
Rosário Pereira Fernandes

33

Mart 2017'den beri: Firebase Cloud Functions'ın eklenmesiyle ve Firebase'in Google Cloud ile daha derin entegrasyonuyla bu artık mümkün.

Cloud Functions ile , Cloud Storage'da epik işlemler yapmak için Google Cloud Node paketini kullanabilirsiniz . Aşağıda, tüm dosya URL'lerini Cloud Storage'dan bir diziye alan bir örnek bulunmaktadır. Bu işlev, bir şey google bulut depolamaya her kaydedildiğinde tetiklenecektir.

Not 1 : Bu, bir paket / klasördeki tüm dosyalar arasında geçiş yapması gerektiğinden, hesaplama açısından oldukça pahalı bir işlemdir.

Not 2 : Bunu sözlere çok fazla detay vermeden örnek olarak yazdım vs. Sadece bir fikir vermek için.

const functions = require('firebase-functions');
const gcs = require('@google-cloud/storage')();

// let's trigger this function with a file upload to google cloud storage

exports.fileUploaded = functions.storage.object().onChange(event => {

  const object = event.data; // the object that was just uploaded
  const bucket = gcs.bucket(object.bucket);
  const signedUrlConfig = { action: 'read', expires: '03-17-2025' }; // this is a signed url configuration object

  var fileURLs = []; // array to hold all file urls 

  // this is just for the sake of this example. Ideally you should get the path from the object that is uploaded :)
  const folderPath = "a/path/you/want/its/folder/size/calculated";

  bucket.getFiles({ prefix: folderPath }, function(err, files) {
    // files = array of file objects
    // not the contents of these files, we're not downloading the files. 

    files.forEach(function(file) {
      file.getSignedUrl(signedUrlConfig, function(err, fileURL) {
        console.log(fileURL);
        fileURLs.push(fileURL);
      });
    });

  });

});

Umarım bu size genel bir fikir verir. Daha iyi bulut işlevi örnekleri için Google'ın Firebase için Cloud Functions örnekleriyle dolu Github deposuna bakın . Ayrıca Google Cloud Node API Belgelerine bakın


35
Bu Firebase sadece Firebase sdk içine bu api katmayan bu çok aptalca
Thaina

4
@Thaina Bence ölçekle ilgisi var. Sadece küçük uygulamaları değil, aynı zamanda devleri de düşünmeleri gerekiyor. Ya bir yolda binlerce dosya varsa. Bu işlem çok fazla bilgi işlem gücü tüketir ve görünüşte masum ve basit olan her arama için bir veritabanına başvurması gerekir. Firebase'i geniş ölçekte kullanmaya ne kadar derine inersem, neden belirli tavizlerin verildiğini o kadar iyi anlıyorum.
johnozbay

1
Bu gcs api'de ayrıca limit ve sayfalandırma da vardır. O halde riski bilmek ve ölçeklenebilecek yöntemi seçmeye çalışmak API tüketicisinin sorumluluğundadır. Ancak aşırı korumacı olmak, bu yüzden seçeneğimizi kesmek iyi bir karar değildir. Gerçekten maliyetliyse ağır yük için ücret alabilirler
Thaina

1
bu en iyi cevap olmalı! Söylediğin için teşekkürler. Şu anda sözdizimi, örneğinizden farklıdır. Parametre olarak bir geri arama göndermek yerine, .thenthis.bucket .getFiles({ prefix: 'path/to/directory' }) .then((arr) => {})
JP Lew

1
@JPLew Rica ederim :) Sözdizimiyle ilgili olarak, yalnızca geri arama hariç tutulursa bir söz verirler. Yani hangisini tercih ederseniz onu kullanmak güvenlidir. Buradaki örneğe bakın: cloud.google.com/nodejs/docs/reference/storage/1.3.x/…
johnozbay

20

Listelenen bir dil olmadığından, bunu Swift ile yanıtlayacağım. İndirme listelerini gerçekleştirmek için Firebase Storage ve Firebase Realtime Database'i birlikte kullanmanızı önemle tavsiye ederiz:

Paylaşılan:

// Firebase services
var database: FIRDatabase!
var storage: FIRStorage!
...
// Initialize Database, Auth, Storage
database = FIRDatabase.database()
storage = FIRStorage.storage()
...
// Initialize an array for your pictures
var picArray: [UIImage]()

Yükle:

let fileData = NSData() // get data...
let storageRef = storage.reference().child("myFiles/myFile")
storageRef.putData(fileData).observeStatus(.Success) { (snapshot) in
  // When the image has successfully uploaded, we get it's download URL
  let downloadURL = snapshot.metadata?.downloadURL()?.absoluteString
  // Write the download URL to the Realtime Database
  let dbRef = database.reference().child("myFiles/myFile")
  dbRef.setValue(downloadURL)
}

İndir:

let dbRef = database.reference().child("myFiles")
dbRef.observeEventType(.ChildAdded, withBlock: { (snapshot) in
  // Get download URL from snapshot
  let downloadURL = snapshot.value() as! String
  // Create a storage reference from the URL
  let storageRef = storage.referenceFromURL(downloadURL)
  // Download the data, assuming a max size of 1MB (you can change this as necessary)
  storageRef.dataWithMaxSize(1 * 1024 * 1024) { (data, error) -> Void in
    // Create a UIImage, add it to the array
    let pic = UIImage(data: data)
    picArray.append(pic)
  })
})

Daha fazla bilgi için Uygulamaya Sıfır: Firebase ile Geliştirme bölümüne ve bunun nasıl yapılacağına dair pratik bir örnek için ilgili kaynak koduna bakın .


3
Ama Cloud Firestore ile aynı sonucu nasıl elde ederim?)
Max Kraev

5

Bir geçici çözüm, içinde hiçbir şey olmayan bir dosya (yani list.txt) oluşturmak olabilir, bu dosyada tüm dosyanın URL'sinin listesiyle özel meta verileri (yani bir Harita <Dize, Dize>) ayarlayabilirsiniz.
Dolayısıyla, bir besleyicideki tüm dosyaları indirmeniz gerekirse, önce list.txt dosyasının meta verilerini indirirsiniz, ardından özel verileri yinelersiniz ve Haritadaki URL'leri içeren tüm dosyaları indirirsiniz.


4
Evet, bu bir geçici
çözümdür

5

Projem üzerinde çalışırken de bu sorunla karşılaştım. Gerçekten bir uç api yöntemi sağlamalarını dilerim. Her neyse, işte böyle yaptım: Firebase depolamaya bir resim yüklerken, bir Nesne oluşturun ve bu nesneyi aynı anda Firebase veritabanına iletin. Bu nesne, görüntünün indirme URI'sini içerir.

trailsRef.putFile(file).addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
        @Override
        public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
            Uri downloadUri = taskSnapshot.getDownloadUrl();
            DatabaseReference myRef = database.getReference().child("trails").child(trail.getUnique_id()).push();
            Image img = new Image(trail.getUnique_id(), downloadUri.toString());
            myRef.setValue(img);
        }
    });

Daha sonra bir klasörden resim indirmek istediğinizde, o klasör altındaki dosyalar arasında yineleme yaparsınız. Bu klasör, Firebase depolama alanındaki "klasör" ile aynı ada sahiptir, ancak istediğiniz gibi adlandırabilirsiniz. Onları ayrı iş parçacığına koydum.

 @Override
protected List<Image> doInBackground(Trail... params) {

    String trialId = params[0].getUnique_id();
    mDatabase = FirebaseDatabase.getInstance().getReference();
    mDatabase.child("trails").child(trialId).addValueEventListener(new ValueEventListener() {
        @Override
        public void onDataChange(DataSnapshot dataSnapshot) {
            images = new ArrayList<>();
            Iterator<DataSnapshot> iter = dataSnapshot.getChildren().iterator();
            while (iter.hasNext()) {
                Image img = iter.next().getValue(Image.class);
                images.add(img);
            }
            isFinished = true;
        }

        @Override
        public void onCancelled(DatabaseError databaseError) {

        }
    });

Artık her bir görüntünün URI'larını içeren nesnelerin bir listesi var, onlarla yapmak istediğim her şeyi yapabilirim. Bunları imageView'e yüklemek için başka bir iş parçacığı oluşturdum.

    @Override
protected List<Bitmap> doInBackground(List<Image>... params) {

    List<Bitmap> bitmaps = new ArrayList<>();

    for (int i = 0; i < params[0].size(); i++) {
        try {
            URL url = new URL(params[0].get(i).getImgUrl());
            Bitmap bmp = BitmapFactory.decodeStream(url.openConnection().getInputStream());
            bitmaps.add(bmp);
        } catch (MalformedURLException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    return bitmaps;
}

Bu, Bitmap'in bir listesini döndürür, tamamlandığında onları ana aktivitede ImageView'a eklerim. Aşağıdaki yöntemler @Override'dır çünkü diğer iş parçacıklarında oluşturulmuş arayüzlerim var ve tamamlanmasını dinliyorum.

    @Override
public void processFinishForBitmap(List<Bitmap> bitmaps) {
    List<ImageView> imageViews = new ArrayList<>();
    View v;
    for (int i = 0; i < bitmaps.size(); i++) {
        v = mInflater.inflate(R.layout.gallery_item, mGallery, false);
        imageViews.add((ImageView) v.findViewById(R.id.id_index_gallery_item_image));
        imageViews.get(i).setImageBitmap(bitmaps.get(i));
        mGallery.addView(v);
    }
}

Önce Liste Görüntüsünün döndürülmesini beklemem ve ardından iş parçacığını Liste Bit Eşleminde çalışması için çağırmam gerektiğini unutmayın. Bu durumda, Görüntü URI'yi içerir.

    @Override
public void processFinish(List<Image> results) {
    Log.e(TAG, "get back " + results.size());

    LoadImageFromUrlTask loadImageFromUrlTask =  new LoadImageFromUrlTask();
    loadImageFromUrlTask.delegate = this;
    loadImageFromUrlTask.execute(results);
}

Umarım birisi bunu yararlı bulur. Gelecekte de kendim için bir lonca hattı görevi görecek.


5

Yüklenen her görüntüyü izlemek ve Veritabanında saklamak için Cloud Function kullanarak görüntüyü Veritabanına eklemenin bir yolu daha.

exports.fileUploaded = functions.storage.object().onChange(event => {

    const object = event.data; // the object that was just uploaded
    const contentType = event.data.contentType; // This is the image Mimme type\

    // Exit if this is triggered on a file that is not an image.
    if (!contentType.startsWith('image/')) {
        console.log('This is not an image.');
        return null;
    }

    // Get the Signed URLs for the thumbnail and original image.
    const config = {
        action: 'read',
        expires: '03-01-2500'
    };

    const bucket = gcs.bucket(event.data.bucket);
    const filePath = event.data.name;
    const file = bucket.file(filePath);

    file.getSignedUrl(config, function(err, fileURL) {
        console.log(fileURL);
        admin.database().ref('images').push({
            src: fileURL
        });
    });
});

Tam kod burada: https://gist.github.com/bossly/fb03686f2cb1699c2717a0359880cf84


5

Js düğümü için bu kodu kullandım

const Storage = require('@google-cloud/storage');
const storage = new Storage({projectId: 'PROJECT_ID', keyFilename: 'D:\\keyFileName.json'});
const bucket = storage.bucket('project.appspot.com'); //gs://project.appspot.com
bucket.getFiles().then(results => {
    const files = results[0];
    console.log('Total files:', files.length);
    files.forEach(file => {
      file.download({destination: `D:\\${file}`}).catch(error => console.log('Error: ', error))
    });
}).catch(err => {
    console.error('ERROR:', err);
  });

Günümü kurtardın !!
hugo blanc


3

Aslında bu mümkündür, ancak yalnızca Firebase'den bir Google Cloud API ile mümkündür . Bunun nedeni, Firebase Storage'ın, Google Cloud API'leriyle kolayca erişilebilen bir Google Cloud Storage Paketi olmasıdır, ancak Firebase'inki yerine Kimlik Doğrulama için OAuth kullanmanız gerekir.


3

Ben de aynı sorunla karşılaştım, benimki daha da karmaşık.

Yönetici, ses ve pdf dosyalarını depolama alanına yükleyecek:

  • sesler / sezon1, sezon2 ... / sınıf1, sınıf 2 / .mp3 dosyaları

  • kitaplar / .pdf dosyaları

Android uygulamasının alt klasörlerin ve dosyaların listesini alması gerekiyor.

Çözüm, depolama üzerindeki yükleme olayını yakalamak ve aynı yapıyı firestore'da bulut işlevini kullanarak oluşturmaktır.

1. Adım: Firestore'da manuel olarak 'depolama' koleksiyonu ve 'ses / kitap' dokümanı oluşturun

görüntü açıklamasını buraya girin

Adım 2: Bulut işlevini ayarlayın

Yaklaşık 15 dakika sürebilir: https://www.youtube.com/watch?v=DYfP-UIKxH0&list=PLl-K7zZEsYLkPZHe41m4jfAxUi0JjLgSM&index=1

3. Adım: Bulut işlevini kullanarak yükleme olayını yakalayın

import * as functions from 'firebase-functions';
import * as admin from 'firebase-admin';
admin.initializeApp(functions.config().firebase);
const path = require('path');

export const onFileUpload = functions.storage.object().onFinalize(async (object) => {
        let filePath = object.name; // File path in the bucket.
        const contentType = object.contentType; // File content type.
        const metageneration = object.metageneration; // Number of times metadata has been generated. New objects have a value of 1.
        if (metageneration !== "1") return;

        // Get the file name.
        const fileName = path.basename(filePath);
        filePath = filePath.substring(0, filePath.length - 1);
        console.log('contentType ' + contentType);
        console.log('fileName ' + fileName);
        console.log('filePath ' + filePath);
        console.log('path.dirname(filePath) ' + path.dirname(filePath));
        filePath = path.dirname(filePath);
        const pathArray = filePath.split("/");
        let ref = '';
        for (const item of pathArray) {
            if (ref.length === 0) {
                ref = item;
            }
            else {
                ref = ref.concat('/sub/').concat(item);
            }
        }

        ref = 'storage/'.concat(ref).concat('/sub')
        admin.firestore().collection(ref).doc(fileName).create({})
                .then(result => {console.log('onFileUpload:updated')})
                .catch(error => {
                    console.log(error);
                });
    });

4. Adım: Firestore'u kullanarak Android uygulamasında klasör / dosya listesini alın

private static final String STORAGE_DOC = "storage/";
    public static void getMediaCollection(String path, OnCompleteListener onCompleteListener) {
        String[] pathArray = path.split("/");
        String doc = null;
        for (String item : pathArray) {
            if (TextUtils.isEmpty(doc)) doc = STORAGE_DOC.concat(item);
            else doc = doc.concat("/sub/").concat(item);
        }
        doc = doc.concat("/sub");

        getFirestore().collection(doc).get().addOnCompleteListener(onCompleteListener);
    }

5. Adım: İndirme url'sini alın

public static void downloadMediaFile(String path, OnCompleteListener<Uri> onCompleteListener) {
        getStorage().getReference().child(path).getDownloadUrl().addOnCompleteListener(onCompleteListener);
    }

Not

Firestore, koleksiyon listesini almayı desteklemediği için her öğeye "alt" koleksiyon eklemeliyiz.

Çözümü bulmam 3 günümü aldı, umarım en fazla 3 saat sürer.

Şerefe.


Tam olarak üzerinde çalıştığım senaryo. Biri bana flutter kodu gönderebilir mi? çünkü sadece toplu dosya yüklemem gerekiyor, indirmem gerekiyor.
Mahesh Peri

Flutter SDK (dart dili)
Mahesh Peri

1
cloud firestore flutter'ı henüz desteklemiyor firebase.google.com/docs/firestore . Hızlı yaklaşım, bulut işlevini kullanarak API yazmak ve ardından bu API'ye her zamanki gibi dinlendirici bir şekilde erişmek. Bulut işlevine alışmak birkaç saat sürebilir, bu eğitim videolarının yutulması oldukça kolaydır: D youtube.com/…
thanhbinh84

3

Rosário Pereira Fernandes'nin cevabını bir JavaScript çözümü için genişletmek :

  1. Firebase'i makinenize yükleyin
npm install -g firebase-tools

  1. Firebase init üzerinde JavaScriptvarsayılan dil olarak ayarlandı
  2. Oluşturulan projenin kök klasöründe npm kurulumlarını yürütün
   npm install --save firebase
   npm install @google-cloud/storage
   npm install @google-cloud/firestore
   ... <any other dependency needed>
  1. Projenize varsayılan olmayan bağımlılıklar ekleyin.
    "firebase": "^6.3.3",
    "@google-cloud/storage": "^3.0.3"

functions / package.json

{
  "name": "functions",
  "description": "Cloud Functions for Firebase",
  "scripts": {
    "lint": "eslint .",
    "serve": "firebase serve --only functions",
    "shell": "firebase functions:shell",
    "start": "npm run shell",
    "deploy": "firebase deploy --only functions",
    "logs": "firebase functions:log"
  },
  "engines": {
    "node": "10"
  },
  "dependencies": {
    "@google-cloud/storage": "^3.0.3",
    "firebase": "^6.3.3",
    "firebase-admin": "^8.0.0",
    "firebase-functions": "^3.1.0"
  },
  "devDependencies": {
    "eslint": "^5.12.0",
    "eslint-plugin-promise": "^4.0.1",
    "firebase-functions-test": "^0.1.6"
  },
  "private": true
}

  1. Bir çeşit listAllişlev oluşturun

index.js

var serviceAccount = require("./key.json");
const functions = require('firebase-functions');

const images = require('./images.js');

var admin = require("firebase-admin");

admin.initializeApp({
    credential: admin.credential.cert(serviceAccount),
    databaseURL: "https://<my_project>.firebaseio.com"
});

const bucket = admin.storage().bucket('<my_bucket>.appspot.com')

exports.getImages = functions.https.onRequest((request, response) => {
    images.getImages(bucket)
        .then(urls => response.status(200).send({ data: { urls } }))
        .catch(err => console.error(err));
})

images.js

module.exports = {
    getImages
}

const query = {
    directory: 'images'
};

function getImages(bucket) {
    return bucket.getFiles(query)
        .then(response => getUrls(response))
        .catch(err => console.error(err));
}

function getUrls(response) {
    const promises = []
    response.forEach( files => {
        files.forEach (file => {
            promises.push(getSignedUrl(file));
        });
    });
    return Promise.all(promises).then(result => getParsedUrls(result));
}

function getSignedUrl(file) {
    return file.getSignedUrl({
        action: 'read',
        expires: '09-01-2019'
    })
}

function getParsedUrls(result) {
    return JSON.stringify(result.map(mediaLink => createMedia(mediaLink)));
}

function createMedia(mediaLink) {
    const reference = {};
    reference.mediaLink = mediaLink[0];
    return reference;
}

  1. firebase deployBulut işlevinizi yüklemek için yürütün
  2. Özel işlevinizi uygulamanızdan çağırın

build.gradle

dependencies {
...
  implementation 'com.google.firebase:firebase-functions:18.1.0'
...
}

kotlin sınıfı

  private val functions = FirebaseFunctions.getInstance()
  val cloudFunction = functions.getHttpsCallable("getImages")
  cloudFunction.call().addOnSuccessListener {...}

Bu özelliğin daha da geliştirilmesi ile ilgili olarak, burada bulunabilecek bazı sorunlarla karşılaştım .


2

Bunu JS ile yapmak için

Bunları doğrudan div kapsayıcınıza ekleyebilir veya bir diziye itebilirsiniz. Aşağıda bunları div'inize nasıl ekleyeceğiniz gösterilmektedir.

1) Görüntülerinizi depoda sakladığınızda, aşağıdaki yapıyla firebase veritabanınızdaki görüntüye bir referans oluşturun

/images/(imageName){
   description: "" , 
   imageSrc : (imageSource) 
}

2) Belgenizi yüklediğinizde, tüm görüntü kaynak URL'lerinizi aşağıdaki kodla depolama yerine veritabanından çekin.

$(document).ready(function(){

var query = firebase.database().ref('images/').orderByKey();
query.once("value").then(function(snapshot){

    snapshot.forEach(function(childSnapshot){

        var imageName = childSnapshot.key;
        var childData = childSnapshot.val();
        var imageSource = childData.url;

        $('#imageGallery').append("<div><img src='"+imageSource+"'/></div>");

    })
})
});

2

Aşağıdaki kodu kullanabilirsiniz. Burada resmi firebase deposuna yüklüyorum ve ardından resim indirme url'sini firebase veritabanına kaydediyorum.

//getting the storage reference
            StorageReference sRef = storageReference.child(Constants.STORAGE_PATH_UPLOADS + System.currentTimeMillis() + "." + getFileExtension(filePath));

            //adding the file to reference 
            sRef.putFile(filePath)
                    .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {
                            //dismissing the progress dialog
                            progressDialog.dismiss();

                            //displaying success toast 
                            Toast.makeText(getApplicationContext(), "File Uploaded ", Toast.LENGTH_LONG).show();

                            //creating the upload object to store uploaded image details 
                            Upload upload = new Upload(editTextName.getText().toString().trim(), taskSnapshot.getDownloadUrl().toString());

                            //adding an upload to firebase database 
                            String uploadId = mDatabase.push().getKey();
                            mDatabase.child(uploadId).setValue(upload);
                        }
                    })
                    .addOnFailureListener(new OnFailureListener() {
                        @Override
                        public void onFailure(@NonNull Exception exception) {
                            progressDialog.dismiss();
                            Toast.makeText(getApplicationContext(), exception.getMessage(), Toast.LENGTH_LONG).show();
                        }
                    })
                    .addOnProgressListener(new OnProgressListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onProgress(UploadTask.TaskSnapshot taskSnapshot) {
                            //displaying the upload progress 
                            double progress = (100.0 * taskSnapshot.getBytesTransferred()) / taskSnapshot.getTotalByteCount();
                            progressDialog.setMessage("Uploaded " + ((int) progress) + "%...");
                        }
                    });

Şimdi kullanabileceğiniz firebase veritabanında depolanan tüm görüntüleri getirmek için

//adding an event listener to fetch values
        mDatabase.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot snapshot) {
                //dismissing the progress dialog 
                progressDialog.dismiss();

                //iterating through all the values in database
                for (DataSnapshot postSnapshot : snapshot.getChildren()) {
                    Upload upload = postSnapshot.getValue(Upload.class);
                    uploads.add(upload);
                }
                //creating adapter
                adapter = new MyAdapter(getApplicationContext(), uploads);

                //adding adapter to recyclerview
                recyclerView.setAdapter(adapter);
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {
                progressDialog.dismiss();
            }
        });

Daha fazla ayrıntı için Firebase Depolama Örneği gönderimi görebilirsiniz .


Bağlantıdaki örneğinizi takip ettim, ancak resimler RecyclerView'da
Firebase'den

1

Firebase deposundan varlık indirmeyi gerektiren bir projem vardı, bu yüzden bu sorunu kendim çözmem gerekiyordu. İşte Nasıl:

1- Öncelikle bir model verisi yapın, örneğin class Choice{}, o sınıfta image Name adlı bir String değişkenini tanımlar, böylece böyle olacaktır

class Choice {
    .....
    String imageName;
}

2- Bir veritabanı / firebase veritabanından, gidin ve görüntü adlarını nesnelere sabit kodlayın, bu nedenle Apple.png adlı görüntü adınız varsa, kullanılacak nesneyi oluşturun

Choice myChoice = new Choice(...,....,"Apple.png");

3- Şimdi, firebase deponuzdaki varlıklar için bağlantı alın ki bu böyle bir şey olacak

gs://your-project-name.appspot.com/

Bunun gibi

4- Son olarak, firebase depolama referansınızı başlatın ve dosyaları böyle bir döngü ile almaya başlayın

storageRef = storage.getReferenceFromUrl(firebaseRefURL).child(imagePath);

File localFile = File.createTempFile("images", "png");
storageRef.getFile(localFile).addOnSuccessListener(new OnSuccessListener<FileDownloadTask.TaskSnapshot>() {

@Override
public void onSuccess(FileDownloadTask.TaskSnapshot taskSnapshot) {
    //Dismiss Progress Dialog\\
}

5- işte bu


1
#In Python

import firebase_admin
from firebase_admin import credentials
from firebase_admin import storage
import datetime
import urllib.request


def image_download(url, name_img) :
    urllib.request.urlretrieve(url, name_img)

cred = credentials.Certificate("credentials.json")

# Initialize the app with a service account, granting admin privileges
app = firebase_admin.initialize_app(cred, {
    'storageBucket': 'YOURSTORAGEBUCKETNAME.appspot.com',
})
url_img = "gs://YOURSTORAGEBUCKETNAME.appspot.com/"
bucket_1 = storage.bucket(app=app)
image_urls = []

for blob in bucket_1.list_blobs():
    name = str(blob.name)
    #print(name)
    blob_img = bucket_1.blob(name)
    X_url = blob_img.generate_signed_url(datetime.timedelta(seconds = 300), method='GET')
    #print(X_url)
    image_urls.append(X_url)


PATH = ['Where you want to save the image']
for path in PATH:
    i = 1
    for url  in image_urls:
        name_img = str(path + "image"+str(i)+".jpg")
        image_download(url, name_img)
        i+=1

API'ye gerek yoktur, sadece basit bir Python sınıfına ve blob anahtar kelimesine ihtiyacınız vardır
Milan Hazra

0

AngularFireAşağıdakileri kullanıyorum ve kullanıyorumdownloadURL

getPhotos(id: string): Observable<string[]> {
    const ref = this.storage.ref(`photos/${id}`)
    return ref.listAll().pipe(switchMap(list => {
      const calls: Promise<string>[] = [];
      list.items.forEach(item => calls.push(item.getDownloadURL()))
      return Promise.all(calls)
    }));
}

-1

Android için en iyi uygulama FirebaseUI ve Glide kullanmaktır.

Kitaplığı almak için bunu gradle / uygulamanıza eklemeniz gerekir. Üzerinde zaten Glide bulunduğunu unutmayın!

implementation 'com.firebaseui:firebase-ui-storage:4.1.0'

Ve sonra kod kullanımınızda

// Reference to an image file in Cloud Storage
StorageReference storageReference = FirebaseStorage.getInstance().getReference();

// ImageView in your Activity
ImageView imageView = findViewById(R.id.imageView);

// Download directly from StorageReference using Glide
// (See MyAppGlideModule for Loader registration)
GlideApp.with(this /* context */)
        .load(storageReference)
        .into(imageView);
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.