ruby-on-rails - 使用 Rails 提交表单后将画布保存到服务器上的图像

Question

我正在使用 Caman JS 在模型项目的编辑视图中操作图像。

$('#vintage').click(function() {
  Caman("#preview_image", function () {
    this.reset();
    this.crossProcess(100)
    this.render(function () {
      this.addClass('selected');
    });
  });
});

Caman JS 为我提供了获取 Canvas 对象的 base64 值的选项

var dataURL = this.toBase64();

但是，我现在有点不知道如何处理这些信息。理想情况下，我想在提交我的 rails 表单时覆盖原始图像。

任何建议都会很棒。

Answer 1

好的，我找到了解决方案。这里是...

创建一个以 base64 数据为值的隐藏字段

<input id="base64" type="hidden" value="" name="base64"/>
var dataURL = this.toBase64();
$('#base64').val(dataURL)

然后我在我的控制器中处理了这个。

unless params[:base64].empty?
  data =  params[:base64]
  image_data = Base64.decode64(data['data:image/png;base64,'.length .. -1])
  File.open("#{Rails.root}/public#{@item.image.url.to_s}", 'wb') do |f|
    f.write image_data
  end
  // Carierwave method to regenerate thumbnails
  @item.image.recreate_versions!
end

可能会帮助某人，我仍然绝对愿意接受有关更好或更有效方法的建议。