storage.getFiles doesn't work

cyril-drouet commented 5 years ago

When I try to do the following, I get an empty object instead of all the files in that folder:

this._app.storage.getFiles({
  folderName: 'Products'
})

I tried with 'Products', and 'Root/Products', but that gave me the same result.

I also get nothing doing this:

this._app.storage.getFiles({
  mediaType: 'images'
})

And the doc says the param is optional but I get a typescript error if I try just getFiles().

galkowicz commented 5 years ago

Having kind of the same the same issue.

fetching folders first:

app.storage.getFolders({ structure: 'nested' })
    .then(folders => console.log('Media folders:', folders)) // prints array of objects representing folders correctly.
    .catch(error => console.error('Something went wrong while retrieving the folders. Details:', error));

then trying to get media ("3AQ0Ds6UwncLUJ8BpD6J" is the id I got from fetching the folders):

app.storage.getFiles({ folderId: "3AQ0Ds6UwncLUJ8BpD6J" })
    .then(files => console.log('files', files));

getting empty object.

using SDK version 1.0.0-alpha.19

jperasmus commented 5 years ago

Thanks for reporting the issue, I will take a look.

jperasmus commented 5 years ago

Can you upgrade to v1.0.0-alpha.21 and try again?

galkowicz commented 5 years ago

After updating to v1.0.0-alpha.21 the issue was fixed. Thank you.

galkowicz commented 5 years ago

After getting the content. I'm not sure how to use it. this is an image object:

{36eAn8ChImSX2fSKbTJW:  {contentType: "image/jpeg",
        file: "36eAn8ChImSX2fSKbTJW_10.jpg",
        folderId: DocumentReference {_key: DocumentKey, firestore: Firestore, _firestoreClient: FirestoreClient},
        id: "36eAn8ChImSX2fSKbTJW",
        sizes: (6) [{…}, {…}, {…}, {…}, {…}, {…}],
        type: "images"}}

How do I extract a url for my img tag? There is no url to get the image from so it's pretty useless..

jperasmus commented 5 years ago

You can use the storage.getURL() method to get the URL for a given file: https://flamelink.github.io/flamelink-js-sdk/#/storage?id=geturl

galkowicz commented 5 years ago

When trying to use getUrl method I get the following error:

[FLAMELINK] The "storage" Firebase service could not be instantiated. Please ensure you have imported the package for this service.

I'm sure I have imported the package otherwise I wouldn't be able to use the 'storage.getFiles' method.

Use getFiles to get the files id's and then for each id use 'storage.getUrl'? It's really not efficient. Would be much better if the response for getFiles would also include a url for the file.

jperasmus commented 5 years ago

This is for the storage Firebase service and not for the Flamelink module. The Flamelink app.storage.getFiles() method gets the files from your database, and not from the storage bucket, so it is totally possible that the Firebase service is not yet imported.

How are you importing the Firebase services?

jperasmus commented 5 years ago

What are you using the storage.getFiles() method for? What are you building on the frontend? Most use cases I've seen so far, people use the app.content methods and then populate the specific files they need from there.

galkowicz commented 5 years ago

this is how I import:

import firebaseApp from './firebaseConfig';
import flamelink from 'flamelink/app';
import 'flamelink/content';
import 'firebase/database';
import 'flamelink/storage';

const app = flamelink({
        firebaseApp,
        env: 'production', // optional, defaults to `production`
        locale: 'en-US', // optional, defaults to `en-US`
        dbType: 'cf' // optional, defaults to `rtdb` - can be 'rtdb' or 'cf' (Real-time DB vs Cloud Firestore)
});

export default app;

Using with react on a frontend SPA. I want to retrieve all the images for a banner on my home page.

As a user of the API I don't know what you just mentioned (That getFiles getting files from database and from storage bucket).

jperasmus commented 5 years ago

What is inside ./firebaseConfig?

jperasmus commented 5 years ago

For a homepage banner, I would recommend you create a single type schema within Flamelink for your home page with a media field for banner images.

Having it set up like that, you can then query the home page content with the images in one go with something like this:

const homepage = await app.content.get({
  schemaKey: 'homePage',
  populate: true
})

galkowicz commented 5 years ago

ok thanks. I just tried this but again got the error:

index.js:1375 [FLAMELINK] The "storage" Firebase service could not be instantiated. Please ensure you have imported the package for this service.

What am I'm doing wrong?

jperasmus commented 5 years ago

You are most likely not importing the firebase/storage service from within ./firebaseConfig.

galkowicz commented 5 years ago

Finally it works!!

Sorry for all the question and thank you very much for your patience (-:

jperasmus commented 5 years ago

No problem, I'm glad it is working now. I would definitely recommend you use the app.content.get() or app.content.subscribe() approach versus using app.storage.getFiles() + app.storage.getURL().

maztak commented 3 years ago

Hi, same issue. I am using Next.js, so to getting data by .get({ fielded: 'aaa', populate: true }) we have to install firebase-admin like below. https://intercom.help/flamelink/en/articles/3022657-using-flamelink-with-nuxt-js

So I wanted to access storage by getURL() at the client-side. Now this is very complicated as this SDK renewed, so I gave up using this SDK:(

flamelink / flamelink-js-sdk

storage.getFiles doesn't work #85