Carrierwave Cloudinary集成Ruby on Rails

Question

我正在尝试制作某种类似于以下内容的个人资料图片上传：用户可以选择想要从他的计算机上传的个人资料图片（carrierwave），然后他可以按照他喜欢的方式裁剪广场的宽高比1：1，就像在Whatsapp（我使用carrierwave-crop-on-fly），最后裁剪的图片通过Cloudinary上传到云端，并绑定到我的模型“用户”的列“图像”。我跟着cloudinary's tutorial做了整合

这是我到目前为止所做的。这是与cloudinary结合的上传者：

class AvatarUploader < CarrierWave::Uploader::Base

  include Cloudinary::CarrierWave
  include CarrierWave::MiniMagick
  process crop: [100, 100]

  def public_id
    model.nombre
  end
end

在用户的模型中：

class User < ActiveRecord::Base
  mount_uploader :image, AvatarUploader
  ...

在我看来，我可以更改该个人资料照片：

.well
  .row-fluid
    .span8.offset2
      %p
        .inline-block
          = form_for @user, method: :post, url: change_photo_self_url do |f|
            = f.file_field :image
            .hidden#cropbox= f.cropbox :image, width: 300, height: 300
            = f.submit "Crop", class: "btn btn-success blanco"
            ...

（当file_field更改时，也就是检查图像时，会出现#cropbox）

最后，在users_controller中

...
    def change_photo
      user = current_user
      user.update_attributes(user_params)
      sign_in(user)
      redirect_to profile_url
    end
    private
      def user_params
        params.require(:user).permit(..., :image)
    end

没有“裁剪”的东西，一切都很好。也就是说，我实现了用户可以选择一个图像上传它，一切正常。但是当我添加控件进行裁剪时，它会崩溃。当我选择图像时，会出现裁剪表面，我可以完美地选择它，但是当我单击提交按钮“裁剪”时，在触及控制器的动作之前会触发以下错误：

Rack::QueryParser::ParameterTypeError at /change_photo
expected Hash (got Hash) for param `image'

以下是电话的参数：

#<Rack::QueryParser::Params:0x396f9f0 @limit=65536, @size=5, @params={"image"=>{:filename=>"140.jpg", :type=>"image/jpeg", :name=>"user[image]", :tempfile=>#<Tempfile:C:/Users/josem/AppData/Local/Temp/RackMultipart20171229-7548-15105ol.jpg>, :head=>"Content-Disposition: form-data; name=\"user[image]\"; filename=\"140.jpg\"\r\nContent-Type: image/jpeg\r\n"}}>

我可能会猜两个同名的参数可能是一个问题，但我不知道如何更改它以使其工作，我不明白为什么“预期哈希（得到哈希）”是一个问题

Answer 1

虽然我不太熟悉“载波波传播”，但您可能需要考虑以不同的方式完成。 Cloudinary还提供开箱即用的上传小部件（https://cloudinary.com/documentation/upload_widget），它还支持执行客户端裁剪。这是您可以测试的基本RoR / CarrierWave / Cloudinary-Upload-widget示例项目：https://github.com/taragano/Carrierwave_widget

此项目目前不包括裁剪功能，但可以轻松添加，请参阅提供的文档页面。您可以在小部件中设置的参数之一是cropping_aspect_ratio，它可以对您有所帮助。

另外，请注意使用窗口小部件，裁剪将在客户端完成，这既有助于加快上传速度，也无需处理裁剪。