在 Rails 5 中处理图像答案

【问题标题】：Handling images in rails 5在 Rails 5 中处理图像
【发布时间】：2016-07-18 18:23:00
【问题描述】：

我正在使用 Rails 5 开发一个 api 应用程序。从客户端我有一个 Anuglar 应用程序。

我有以下要求：

图像的异步上传。（请注意，这意味着图像在第一次没有附加到模型上）。
要创建的模型可以附加 N 个图像。
为每个上传的图像创建 M 个指定的缩略图。（请注意，还应将缩略图附加到模型上。）

我已阅读有关 CarrierWave 和回形针的信息，但我不知道如何才能满足所有这些要求。

我将非常感谢任何涵盖所有这些要求的建议、lib、gem 等。

【问题讨论】：

要求我们推荐或查找书籍、工具、软件库、教程或其他场外资源的问题对于 Stack Overflow 来说是无关紧要的，因为它们往往会吸引固执己见的答案和垃圾邮件。相反，请描述问题以及迄今为止为解决该问题所做的工作。如果您可以改写这个问题以提出特定的编程问题（例如“我正在尝试用 PaperClip 做 x、y、z”），那么您将回到主题。
@MarsAtomic，我无法尝试任何事情，因为我没有找到满足所有要求的 gem。
@Overflow012 paperclip 和 carrierwave 的文档将向您展示哪些工具可供您使用，并且两者都足以满足您的需求。但是，两者都需要您按照您在应用程序后端中描述的方式实现处理。因此，这个“问题”没有方向，也没有确定的答案。

标签： ruby-on-rails ruby-on-rails-5

【解决方案1】：

我已经用 CarrierWave gem 实现了类似的东西。假设您希望将图像附加到模型 Post。

在模型中：

class Post < ActiveRecord::Base
  has_many :photos, inverse_of: :post
end

然后你可以有一个照片模型：

class Photo < ActiveRecord::Base
   belongs_to :post
   mount_uploader :post_image, PostImageUploader
end

然后你可以把这个添加到app/uploaders/post_image_uploader.rb

class PostImageUploader < CarrierWave::Uploader::Base
  # Create different versions of your uploaded files:
    version :standard do
      process resize_to_fit: [800, 800]
    end

    version :thumb do 
      process resize_to_fit: [100, 100]
    end
end

由于您是通过 api 创建图像，因此您必须将图像转换为 Base64 字符串并作为参数发送。在此示例中，base64 字符串在将其发送到服务器之前位于参数 [:photo][:photo_data] 中。在photos_controller.rb 有这个：

def create
  @photo = Photo.new(photo_params)
  @photo.post_image = decode_photo_data(params[:photo][:photo_data])

  if @photo.save
    render json: @photo, status: :created, location: @photo
  else
    render json: @photo.errors, status: :unprocessable_entity
  end 
end

 #decode base64 data to an jpg image: 
 def decode_photo_data(photo_data)
    data = StringIO.new(Base64.decode64(photo_data))

    data.class.class_eval { attr_accessor :original_filename, :content_type }
    data.original_filename = "upload.jpg"
    data.content_type = "image/jpg"

       # return decoded data
    data
 end

  def photo_params
    params.require(:photo).permit(:caption, :post_id)
  end

有了这个，当你用这样的 body 向你的 create photo api 端点发出 post 请求时

{"photo": {"caption": "an image", "post_id": 1, "photo_data":<your image base64 string>}}

它将创建一个photo 和一个standard 和一个thumb 版本，用于post 和id 的1。

【讨论】：