导轨：回形针和预览？
你知道在某些网站上你被要求上传一个头像，你点击按钮，选择你的文件，然后点击确定，但在你提交页面之前 （如，没有创建/更新记录），显示图像的一点预览？
如何使用Paperclip for Rails实现这一目标？
对于任何可以指向我的教程或可能告诉我如何在保存记录之前对图像进行Javascript裁剪的人的奖励积分。
我无法在Google上找到关于此主题的更多内容…感谢您的帮助！
从Rails的角度来看，这种事情是有问题的，因为图像上传的工作方式。 使其更好地运作的一个策略是：
- 为您的图片上传制作一个子表单，可能使用swfupload使其更加简化。
- 创建一个模型以接收您的上传，其中包括用于检索和链接它的一些随机访问密钥。 Paperclip处理附件。
- 当子窗体完成时，使用AJAX通过插入隐藏字段或可能带有相应unique_key的可见复选框元素来填充主窗体。
典型的模型看起来像这样：
class Avatar < ActiveRecord::Base has_attached_file :image # ... Additional Paperclip options here before_validation :assign_unique_key belongs_to :user def to_param self.unique_key end protected def assign_unique_key return if (self.unique_key.present?) self.unique_key = Digest::SHA1.hexdigest(ActiveSupport::SecureRandom.random_number(1<<512).to_s) end end unique_key字段的原因是您可以将其链接到可能未保存的记录的forms。 在将其放入URL时使用unique_key而不是id是有利的，因为很难判断用户是否应该能够在上传时查看该图片，因为尚未分配所有者用户。
这也可以防止好奇的人在您的URL中更改某种顺序，易于猜测的ID，并查看已上传的其他头像。
您可以像此处的任何模型一样检索“阿凡达”的最终resize的缩略图URL。
您可以在收到时轻松删除参数并转换回头像ID号码：
# If an avatar_id parameter has been assigned... if (params[:user][:avatar_id]) # ...resolve this as if it were a unique_key value... avatar = Avatar.find_by_unique_key(params[:user][:avatar_id]) # ...and repopulate the parameters if it has been found. params[:user][:avatar_id] = (avatar && avatar.id) end # ... params[:user] used as required for create or update
当人们上传并重新上传图片时，您最终会有大量孤立的记录，这些记录实际上并未在任何地方使用。 在合理的时间过后，编写一个rake任务来清除所有这些是很简单的。 例如：
task :purge_orphan_avatars => :environment do # Clear out any Avatar records that have not been assigned to a particular # user within the span of two days. Avatar.destroy_all([ 'created_at
使用destroy_all也应该具有清除所有Paperclip材质的效果。
我发现此处发布的解决方案很有用，您只需将其修改为只有一个文件（如果您正在进行单个文件上传）：
<%= image_tag @upload.image, id:"something_unique"%> <%= form_for @upload, :html => { :multipart => true } do |f| %> <%= f.file_field :image, id:"something_else_unique" %> <%= f.submit "Add photo" %> <% end %>
注意：我使用了一个单独的回形针模型，一个具有图像属性的上传模型。 您可以为图像预览标记添加样式以格式化图片大小（否则它将是原始大小）。
或者您可以使用ajax和iframe http://www.html5rocks.com/en/tutorials/file/dndfiles/#toc-reading-files