CODEWITHSUNDEEP
javascripthtmlember.jslaravelupload
Jacob Windsor
Jacob Windsor

Reputation: 6980

Upload files asynchronously then save data about it

I am building a way for users to upload tracks with information about that track but I would like to do this asynchronously much like YouTube does.

At the moment there is an API endpoint of tracks that accepts a POST request with the uploaded file and all the meta data. It processes the track, validates everything and will then save the path to the track and all of its meta data in the database. This works perfectly but I am having trouble thinking of ways to do this asynchronously.

The user flow will be:

1) User selects a track and it starts uploading

2) A form to fill in meta data shows and user fills it in

3) Track is uploaded with its metadata to the endpoint

The problem is that the metadata form and the file upload are now two separate entities and now the file can finish uploading before the metadata is saved and vice-versa. Ideally to overcome this both the track and metadata would be saved in the browser as a cookie or something until they are both completed. At that point both would be sent to the endpoint and no changes would be required at the back end. As far as I am aware there is no way of saving files client side like this. Oh apart from that filesystem API which is pretty much deprecated.

If anyone has any good suggestions about how to do this it would be much appreciated. In a perfect world I would like there to be no changes to the back end at all but little changes are probably going to be required. Preferably no database alterations though.

Oh by the way I'm using laravel and ember.js just in case anyone knows of any packages already doing this.

Upvotes: 1

Views: 125

Answers (1)

Jovan Perovic
Jovan Perovic

Reputation: 20191

I have thought about this a lot few months ago.

The closest solution that I managed to put together is to upload file and store it's filename, size, upload time (this is crucial) and other attributes in DB (as usual). Additionally, I've added the column temporary (more like a flag) which would initially be set to TRUE and only after you would sent meta data it would be negated.

Separately, I've set the cron job (I used Symfony2, but in Laravel is all the same) that would run on every 15-30 minutes and delete those files (and corresponding database records) which had temporary = TRUE and exceeded time window. In my case it was 15 minutes but you could set it to be coarse (every hour or so).

Hope this helps a bit :)

Upvotes: 2

Related Questions