如果我拥有一张在客户端使用JavaScript编辑/生成的图片(例如,裁剪过的照片或画布绘制的结果),是否有办法使用ActiveStorage上传它?
通常情况下,它将是一个包含在JavaScript变量中存储的大字符串,其中包含"<img src='data:image/jpeg;base64,...=='>"
,而不是一个文件。
如果我拥有一张在客户端使用JavaScript编辑/生成的图片(例如,裁剪过的照片或画布绘制的结果),是否有办法使用ActiveStorage上传它?
通常情况下,它将是一个包含在JavaScript变量中存储的大字符串,其中包含"<img src='data:image/jpeg;base64,...=='>"
,而不是一个文件。
你可以这样做:
decoded_data = Base64.decode64(params[:base64].split(',')[1])
resource.image = {
io: StringIO.new(decoded_data),
content_type: 'image/jpeg',
filename: 'image.jpg'
}
这方面有一个宝石可用。
请查看https://github.com/rootstrap/active-storage-base64
安装宝石后,操作相当简单明了。
class User < ActiveRecord::Base
include ActiveStorageSupport::SupportForBase64
end
class User < ApplicationRecord
has_one_base64_attached :avatar
end
给你的模型实例赋值的方式是:
base64 = 'data:image/png;base64,[base64 data]'
user.avatar = {data: base64}
我没有使用 gem 完成这个任务。
Model.create!(
product: product,
attachment: {
io: StringIO.new(Base64.decode64(params[:product][:base_64_image].split(',')[1])),
content_type: 'image/jpeg',
filename: 'image.jpeg'
}
)
class Booking < ApplicationRecord
...
has_one_attached :signature
...
module Api
module V1
class BookingsController < Api::V1::ApiController
...
def confirm_hire_details
booking = current_user.bookings.find(params[:id])
if booking.update(booking_params.merge(
{
signature: signature_decoded
}
))
...
else
...
end
end
private
def signature_decoded
decoded_data = Base64.decode64(params[:signature].split(',')[1])
{
io: StringIO.new(decoded_data),
content_type: 'image/jpeg',
filename: "signature-#{Time.current.to_i}.jpg"
}
end