Implementation of fully functional media uploading in web application

Question

Suppose we have the web application which handle create, read, update and delete articles and each article should have gallery of images. I have to make one to one relation

Answer 1

I haven't work with the case personaly, but my co-worker had similar conundrum. She used

punkave/symfony2-file-uploader-bundle

It's a bundle that wrapps jQuery File Upload plugin. It is in the early stages and a lot of things are missing, such as event, but we gave it a shot.

That's what we do: in newAction() we create entity, generate unique dir ID, and store the ID in entity (via regular setDirId()). Than we create the form, which contains hidden field dirId.

We are uploading the files to temp dir on server via ajax, not during the submit. Ajax request requires the ID. It stores files in temp_dir/prefix_ID

Than it's quite simple. Form is sent. If form is valid - move files from temp to dest dir. If not - we have the ID, and are able to show the images.

However, we do not save information about individual files in a separate table in the database. Every time we read the contents of the folder that corresponds to our dirId.

I know it's not the solution You are asking for. It's rather a workaround.

Answer 2

The problem with enabling file uploads on the create mask is that you eventually end up with orphaned files. This is because a user is able to trigger the upload without saving the actual entity. While creating a very own UploadBundle I thought about this problem for a while and came to the conclusion that there is no truly proper solution.

I ended up implementing it like this:

Given the fact that our problem arise from orphaned files, I created an Orphanage which is in charge of managing these files. Uploaded files will first be stored in a separate directory, along with the session_id. This helps distinguishing files across different users. After submitting the form to create the actual entity, you can retrieve the files from the orphanage by using only your session id. If the form was valid you can move the files from the temporary orphanage directory to the final destination of your files.

This method has some pitfalls:

• The orphanage directory itself should be cleaned on a regular basis using a cron job or the like.
• If a user will upload files and choose not to submit the form, but instead start over with a new form, the newly uploaded files are going to be moved in the same directory. Therefore you will get both the files uploaded the first time and the second time after getting the uploaded files.

This is not the ultimate solution to this problem but more of a workaround. It is in my opinion however cleaner than using temporary entities or session based storage systems.

The mentioned bundle is available on Github and supports both Orphanage and the jQuery File Uploader plugin.

1up-lab/OneupUploaderBundle