47

With the new Firebase API you can upload files into cloud storage from client code. The examples assume the file name is known or static during upload:

// Create a root reference
var storageRef = firebase.storage().ref();
    
// Create a reference to 'mountains.jpg'
var mountainsRef = storageRef.child('mountains.jpg');
    
// Create a reference to 'images/mountains.jpg'
var mountainImagesRef = storageRef.child('images/mountains.jpg');

or

// File or Blob, assume the file is called rivers.jpg
var file = ...
    
// Upload the file to the path 'images/rivers.jpg'
// We can use the 'name' property on the File API to get our file name
var uploadTask = storageRef.child('images/' + file.name).put(file);

With users uploading their own files, name conflicts are going to be an issue. How can you have Firebase create a filename instead of defining it yourself? Is there something like the push() feature in the database for creating unique storage references?

Sam Spencer
  • 8,403
  • 12
  • 72
  • 130
Travis Christian
  • 2,272
  • 2
  • 24
  • 38

4 Answers4

84

Firebase Storage Product Manager here:

TL;DR: Use a UUID generator (in Android (UUID) and iOS (NSUUID) they are built in, in JS you can use something like this: Create GUID / UUID in JavaScript?), then append the file extension if you want to preserve it (split the file.name on '.' and get the last segment)

We didn't know which version of unique files developers would want (see below), since there are many, many use cases for this, so we decided to leave the choice up to developers.

images/uuid/image.png   // option 1: clean name, under a UUID "folder"
image/uuid.png          // option 2: unique name, same extension
images/uuid             // option 3: no extension

It seems to me like this would be a reasonable thing to explain in our documentation though, so I'll file a bug internally to document it :)

Community
  • 1
  • 1
Mike McDonald
  • 14,835
  • 2
  • 42
  • 47
  • is there a way to do this with to web version of firebase? – Nick Garver Sep 12 '16 at 04:19
  • Yes, see http://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript as mentioned above – Mike McDonald Sep 12 '16 at 06:15
  • This is pretty terrible if you want users to download the files back. There should be a simple way to rename the files on the fly before uploading if a file exists. – Pier Dec 21 '16 at 15:26
  • @Pier agreed, though curious how would you see this working (maybe propose an API)? Seems like it would either require syncing file names locally or always reading before writing (to resolve naming conflicts), which would kill performance. We recommend syncing file names anyways (using the realtime DB), so with that approach "listing file names" thing is less of an issue. – Mike McDonald Dec 21 '16 at 15:59
  • Actually, the folder with a uuid is a great solution. I hadn't seen that before. Sorry. – Pier Dec 21 '16 at 16:13
  • 6
    It's all good--we appreciate feedback in making the product better. Not trying to say your input isn't valid/these solutions are *the best*, just hoping that they serve the needs of a majority of devs and make the product easy and fun to use :) – Mike McDonald Dec 21 '16 at 16:14
  • 1
    I'm confused by the uuid doc. If generating "time-based" uuid what's to prevent two users' uuid from colliding if generated at the same time? If generating "random" uuid then isn't there a tiny chance two uuid's will collide as well? – pete May 27 '17 at 07:59
  • 1
    time-based i am not sure, but yes a random uuid could collide, but the chance is so small it's nearly impossible. – Mindless Oct 12 '17 at 03:41
  • 1
    User ID + the file increment + date now + math random substring 2 – Luka Jul 09 '20 at 08:46
3

This is the solution for people using dart

Generate the current date and time stamp using:-

var time = DateTime.now().millisecondsSinceEpoch.toString();

Now upload the file to the firebase storage using:-

await FirebaseStorage.instance.ref('images/$time.png').putFile(yourfile);

You can even get the downloadable url using:-

var url = await FirebaseStorage.instance.ref('images/$time.png').getDownloadURL();

Aman Kumar Singh
  • 31
  • 3
2

First install uuid - npm i uuid

Then define the file reference like this

import { v4 as uuidv4 } from "uuid";

const fileRef = storageRef.child(
            `${uuidv4()}-${Put your file or image name here}`
          );

After that, upload with the file with the fileRef

fileRef.put(Your file)

Shisui
  • 23
  • 2
0

In Android (Kotlin) I solved by combining the user UID with the milliseconds since 1970:

val ref = storage.reference.child("images/${auth.currentUser!!.uid}-${System.currentTimeMillis()}")
Damien
  • 604
  • 3
  • 9
  • 28