在 Web 应用程序中实现全功能媒体上传 [英] Implementation of fully functional media uploading in web application
问题描述
假设我们有一个处理创建、阅读、更新和删除文章的网络应用程序，并且每篇文章都应该有图片库.我必须在文章和画廊之间建立一对一的关系，在画廊和媒体之间建立一对多的关系.
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 between Article and Gallery and one to many relation between Gallery and Media.
HTML5提供了很多像multiupload这样的特性，所以我想用这个优秀的http:///blueimp.github.io/jQuery-File-Upload/ 插件.问题是如何像其他表单的数据一样处理内存中"的文件上传?
HTML5 gives a lot of features like multiupload, so I want to use this excellent http://blueimp.github.io/jQuery-File-Upload/ plugin for that. The problem is how to handle the file upload "in memory" like other form's data?
例如，当我们显示创建新文章的页面时，我们应该能够填写文章的数据字段并选择要上传的图像，然后当我们单击保存按钮时，图像应该开始上传，然后表单应该提交.当验证失败时，图像仍应显示在前端，但应保存在服务器端 nothink.
For example when we show the page for create new article we should be able to fill in article's data fields and select images to upload, next when we click the save button the images should start upload and after that the form should submit. When validation fails the images should be still displayed on the frontend, but on the server-side nothink should be saved.
其中一个解决方案是在显示整个表单之前创建类似于创建实体会话临时 id"的想法，并且该 id 可用于创建临时目录以保存上传，因此在成功保存表单后，这些图像可以移动到适当的目录，但是如何使创建实体会话临时id"?
One of the solutions is create somethink like "create entity session temporary id" before displaying the entire form and that id can be used to create temporary directory for save uploads, so after success saved form these images can be moved to appropriate directory, but how to make the "create entity session temporary id"?
我认为另一种解决方案是使用编辑 id"方法，因为我们可以使用以前保存的画廊 id 处理上传，但有时我无法用画廊保存新的空白文章，因为某些字段应该db 中不能为空.
The other solution I think is the "with the edit id" approach, because we can handle the uploads with previously saved gallery id, but sometimes I can't save new blank article with gallery, cause some of the fields should't be empty in db.
我在 Rails 中看到了 https://github.com/thoughtbot/paperclip gem自述文件说:
For the Rails I saw https://github.com/thoughtbot/paperclip gem which in the Readme says:
Paperclip 旨在作为 Active Record 的简单文件附件库.它背后的目的是使设置尽可能简单，并尽可能像对待其他属性一样对待文件.这意味着它们不会保存到磁盘上的最终位置，如果设置为 nil，它们也不会被删除，直到调用 ActiveRecord::Base#save.
Paperclip is intended as an easy file attachment library for Active Record. The intent behind it was to keep setup as easy as possible and to treat files as much like other attributes as possible. This means they aren't saved to their final locations on disk, nor are they deleted if set to nil, until ActiveRecord::Base#save is called.
我的问题是它是如何工作的?
My question is how it works?
推荐答案
在创建掩码上启用文件上传的问题是您最终会得到孤立文件.这是因为用户能够在不保存实际实体的情况下触发上传.在创建一个自己的 UploadBundle 时，我考虑了这个问题一段时间，得出的结论是没有真正合适的解决方案.
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.
我最终是这样实现的:
鉴于我们的问题是由孤立文件引起的，我创建了一个 Orphanage 来负责管理这些文件.上传的文件将首先与 session_id 一起存储在单独的目录中.这有助于区分不同用户的文件.提交表单以创建实际实体后，您可以仅使用会话 ID 从孤儿院检索文件.如果表单有效，您可以将文件从临时孤儿院目录移动到文件的最终目的地.
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.
这种方法有一些缺陷:
- 孤儿院目录本身应定期使用 cron 作业等进行清理.
- 如果用户上传文件并选择不提交表单，而是从新表单重新开始，则新上传的文件将被移动到同一目录中.因此，您将获得第一次上传的文件和第二次上传的文件.
这不是这个问题的最终解决方案，而是一种解决方法.但在我看来，它比使用临时实体或基于会话的存储系统更干净.
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.
提到的包在 Github 上可用，并且支持 孤儿院和jQuery 文件上传器 插件.
The mentioned bundle is available on Github and supports both Orphanage and the jQuery File Uploader plugin.
这篇关于在 Web 应用程序中实现全功能媒体上传的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
