简体   繁体   English

将 Base64 png 保存到载波

[英]Saving Base64 png to carrierwave

I have a base64 png file bring sent through the params.我有一个通过参数发送的 base64 png 文件。 It is a base64 because it is coming through HTML5 canvas.它是 base64,因为它来自 HTML5 canvas。 The attribute it is being passed through as is a nested fields_for.它传递的属性是嵌套的fields_for。 I am not sure but this may be inhibiting it from being saved?我不确定,但这可能会阻止它被保存? doubt it though虽然怀疑

I tried the top accepted answer: Rails Carrierwave Base64 image upload我尝试了最接受的答案: Rails Carrierwave Base64 image upload

It didn't help它没有帮助

The one different in this Post is that my base64 comes in like such as: "data:image/png;base64,iVvdvadGAqwete...."这篇文章的不同之处在于我的 base64 像这样出现:“data:image/png;base64,iVvdvadGAqwete....”

my uploader:我的上传者:

class PrintFileUploader < CarrierWave::Uploader::Base

  include CarrierWave::MiniMagick

  storage :aws

  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

  class CarrierStringIO < StringIO
    attr_accessor :original_filename
    attr_accessor :content_type
  end
  version :canvas do
    process resize_to_fit: [1500, 1500]
  end

  def content_type_whitelist
    /image\//
  end

  def extension_whitelist
    %w(jpg jpeg png)
  end

end

Model: Model:

  mount_uploader :print_file, PrintFileUploader

  def image_data=(data)
    io = CarrierStringIO.new(base64.decode64(data))
    # self.mockup_image = io
    self.print_file = io
  end

Nothing seems to be happening here.这里似乎什么都没有发生。 When i check the record, the print_file is nil当我检查记录时, print_filenil

I do know base64 carrierwave gem does exist but this is someting I would like to have done without the use of a gem.我确实知道 base64 载波宝石确实存在,但这是我想在不使用宝石的情况下完成的事情。

How can i take my base64 png, convert it to carrierwave and have it sent to aws through carrierwaave?如何获取我的 base64 png,将其转换为carrierwave并通过carrierwaave发送到aws?

Attempts:尝试:

  def image_data=(data)
    data = data[(data.index(',') + 1)..-1]
    io = CarrierStringIO.new(base64.decode64(data))
    self.print_file = io
  end

also tried adding the data = data[(data.index(',') + 1)..-1] to the content_type, just to try.还尝试将data = data[(data.index(',') + 1)..-1]添加到 content_type,只是为了尝试。

Also tried this in my uploader:在我的上传器中也试过这个:

  before :cache, :convert_base64

  class CarrierStringIO < StringIO
    def original_filename
      # the real name does not matter
      "photo.png"
    end

    def content_type
      # this should reflect real content type, but for this example it's ok
      "image/png"
    end
  end

  def convert_base64(file)
    if file.respond_to?(:original_filename) && file.original_filename.match(/^base64:/)
      fname = file.original_filename.gsub(/^base64:/, '')
      ctype = file.content_type
      decoded = Base64.decode64(file.read)
      file.file.tempfile.close!
      decoded = CarrierStringIO.new(decoded)
      decoded.original_filename = fname
      decoded.content_type = ctype
      file.__send__ :file=, decoded
    end
    file
  end

Found ^ this from other accepted answers but none of these seem to be working.从其他已接受的答案中找到 ^,但这些似乎都不起作用。

Just in case is matters, my base64 png is coming from javascript from a canvas like so:以防万一,我的 base64 png 来自 javascript 来自 canvas,如下所示:

var url = canvas.toDataURL('image/png')
$("#canvascontent").val(url);

With the <... id="canvascontent" > being a hidden field in the form. <... id="canvascontent" >是表单中的隐藏字段。

The image data is encoded in what's called the data-uri scheme .图像数据以所谓的data-uri 方案进行编码。 This format is of type:此格式的类型为:

data:[<media type>][;base64],<data>

Before you base64 decode this data you need to remove the header:在 base64 解码此数据之前,您需要删除 header:

data = "data:image/png;base64,iVvdvadGAqwete...."

# Strip header
data = data[(data.index(',') + 1)..-1] 

# Decode
base64.decode64(data)

Or use the Data URI gem:或使用数据 URI gem:

uri = URI::Data.new(data)
uri.content_type # image/png
uri.data         # Base64 decoded data

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM