RailsでAWS SDKを用いてファイルをS3へダイレクトアップロードする方法

# docker-compose.yml

version: "2"
services:
  # 省略
  s3:
    image: minio/minio:latest
    ports:
      - "9000:9000"
      - "9001:9001"
    volumes:
      - s3:/data
    command: "server /data --console-address :9001"
    environment:
      MINIO_ROOT_USER: user
      MINIO_ROOT_PASSWORD: password

volumes:
  # 省略
  s3:

# spec/support/s3_test_helper.rb

class S3TestHelper
  def resource
    @resource ||= Aws::S3::Resource.new(
      region: "ap-northeast-1",
      access_key_id: "user",
      secret_access_key: "password",
      endpoint: "http://#{ENV['S3_HOST']}:9000",
      force_path_style: true,
    )
  end

  def bucket_name
    "dummy-bucket-#{Rails.env}"
  end

  def bucket
    @bucket ||= resource.bucket(bucket_name)
  end

  def create_bucket
    begin
      resource.create_bucket(acl: 'private', bucket: bucket_name)
    rescue Aws::S3::Errors::BucketAlreadyOwnedByYou
      puts "#{bucket_name} already exists."
    end
  end

  def clear_bucket!
    bucket.clear!
  end

  def object_exist?(object_key)
    object = bucket.object(object_key)
    object.exists?
  end
end

RSpec.configure do |config|
  s3_test_helper = S3TestHelper.new

  s3_test_helper.create_bucket
  s3_test_helper.clear_bucket!
end

http://s3-ap-northeast-1.amazonaws.com/<bucket-name> # パス形式
http://<bucket-name>.s3-ap-northeast-1.amazonaws.com # 仮想ホスト形式

# Dockerfile

FROM minio/minio:latest

RUN microdnf upgrade -y && microdnf clean all

CMD ["minio", "server", "/data"]

# .github/workflows/ci.yml

# 省略
jobs:
  rails_test:
    # 省略
    services:
      # 省略
      s3:
        # imageには上記のDockerfileから作ったimageを指定する
        image: containers.git.pepabo.com/suzuri/images/minio:latest
        ports:
          - "9000:9000"
        env:
          MINIO_ROOT_USER: user
          MINIO_ROOT_PASSWORD: password

    container:
      env:
        S3_HOST: s3
        S3_CDN_HOST: s3
# 省略

class DigitalProductS3Client
  def resource
    @resource ||= Aws::S3::Resource.new(
      region: ENV['AWS_REGION'] || 'ap-northeast-1',
      access_key_id: ENV['AWS_ACCESS_KEY_ID'] || 'user',
      secret_access_key: ENV['AWS_SECRET_ACCESS_KEY'] || 'password',
      endpoint: ENV['AWS_ACCESS_KEY_ID'] ? "https://#{ENV['S3_HOST']}" : "http://#{ENV['S3_HOST']}:9000", # AWS_ACCESS_KEY_IDがあるときはS3に繋ぐ
      force_path_style: Rails.env.development? || Rails.env.test?,
    )
  end

  def bucket
    @bucket ||= resource.bucket(
      ENV['S3_BUCKET'] || "dummy-bucket-#{Rails.env}"
    )
  end

  # AWS SDKのpresigned_postと混同しないようにmy_presigned_postとしました
  def my_presigned_post(content_type, file_name, owner_id)
    res = bucket.presigned_post(
    key: "digital_product_contents/data/pre_saved/user-#{owner_id}/#{SecureRandom.uuid}/#{file_name}",
      success_action_status: '201',
      acl: 'private',
      content_type: content_type,
      metadata: {
        'original-filename' => file_name
      }
    )

    {
      # Railsをdocker上で動かしている場合、Railsからs3(minio)へアクセスする時のホスト名はs3になる
      # しかし、フロントエンドからアクセスする時のホスト名はlocalhostを使わなければならない
      url: Rails.env.development? ? res.url.gsub('http://s3', 'http://localhost') : res.url,
      fields: res.fields
    }
  end
end

digital_product_s3_client = DigitalProductS3Client.new
presigned_post = digital_product_s3_client.my_presigned_post(content_type, file_name, current_user.id)

# 以下をクライアントに返す
{ presigned_url: presigned_post[:url], fields: presigned_post[:fields] }

# spec/support/s3_test_helper.rb

class S3TestHelper
  # 省略
  def post_file(image_file_name, presignedUrl, fields)
    image_file = File.open(image_file_name)

    begin
      data = fields
      data['file'] = image_file

      uri = URI.parse(presignedUrl)
      http = Net::HTTP.new(uri.host, uri.port)

      req = Net::HTTP::Post.new(uri.request_uri)
      req.set_form(data, "multipart/form-data")

      response = http.request(req)
    ensure
      image_file.close
      response
    end
  end
end

require 'spec_helper'

describe DigitalProductS3Client do
  let!(:digital_product_s3_client) { DigitalProductS3Client.new }

  let(:s3_test_helper) { S3TestHelper.new }
  let!(:clear_bucket) { s3_test_helper.clear_bucket! }

  describe '#presigned_post' do
    let(:user) { create(:user) }
    let!(:presigned_post) do
      digital_product_s3_client.my_presigned_post('image/jpeg', 'sample.jpg', user.id)
    end
    let!(:url) { presigned_post[:url] }
    let!(:fields) { presigned_post[:fields] }

    it 'presigned_urlとがfieldsが返る' do
      expect(url).to be_truthy
      expect(fields['key']).to match(/digital_product_contents\/data\/pre_saved\/user-[0-9]*\/[0-9a-z-]*\/sample\.jpg/)
      expect(fields['success_action_status']).to eq('201')
      expect(fields['acl']).to eq('private')
      expect(fields['Content-Type']).to eq('image/jpeg')
      expect(fields['x-amz-meta-original-filename']).to eq('sample.jpg')
      expect(fields['policy']).to be_truthy
      expect(fields['x-amz-credential']).to be_truthy
      expect(fields['x-amz-algorithm']).to eq('AWS4-HMAC-SHA256')
      expect(fields['x-amz-date']).to be_truthy
      expect(fields['x-amz-signature']).to be_truthy
    end

    it 'presigned_urlとfieldsを使ってs3にファイルがアップロードでき、201が返る' do
      response = s3_test_helper.post_file('spec/fixtures/sample.jpg', url, fields)

      expect(
        s3_test_helper.object_exist?(fields['key'])
      ).to eq(true)
      expect(response.code).to eq('201')
    end
  end
end

<input type="file" id="file-selector" />

// サーバサイドからpresignedUrlとfieldsを受け取ってるものとします
const element = document.getElementById(
  'file-selector'
) as HTMLInputElement
const file = element.files?.[0]

const formData = new FormData()
for (const key in fields) {
  formData.append(key, fields[key])
}
formData.append('file', file)
const res = await axios.post(
  presignedUrl,
  formData
)

if (res.status === 201) {
  // 成功した時の処理
}

class DigitalProductS3Client
  # 省略

  def object_headers(object_key)
    object = bucket.object(object_key)

    {
      content_length: object.content_length,
      content_type: object.content_type,
      file_name: object.metadata['original-filename'],
    }
  end
end

class DigitalProductS3Client
  # 省略

  def copy_object(from_key, to_key)
    from_object = bucket.object(from_key)
    from_object.copy_to(bucket: bucket.name, key: to_key)
  end

  def delete_object(object_key)
    bucket.object(object_key).delete
  end
end

    :storage: :s3
    :url: ':s3_alias_url'
    :s3_credentials:
      <<: *s3_credentials
    :path: ':class/:attachment/saved/user-:user_id/:id:dotextension'
    :s3_protocol: <%= (Rails.env.development? || Rails.env.test?) ? "http" : 'https' %>
    :s3_host_alias: <%= (Rails.env.development? || Rails.env.test?) ? "#{ENV['S3_CDN_HOST']}:9000/dummy-bucket-#{Rails.env}" : "#{ENV['S3_CDN_HOST']}" %>
    :s3_region: <%= ENV['AWS_REGION'] || 'ap-northeast-1' %>
    :s3_options:
      :endpoint: <%= (Rails.env.development? || Rails.env.test?) ? "http://#{ENV['S3_HOST']}:9000" : "https://#{ENV['S3_HOST']}" %>
      :force_path_style: <%= Rails.env.development? || Rails.env.test? %>
    :s3_permissions: :private

# config/initializers/paperclip.rb

Paperclip.interpolates :user_id do |attachment, style|
  attachment.instance.user_id
end

class DigitalProductS3Client
  # 省略

  # AWS SDKのpresigned_postと混同しないようにmy_presigned_postとしました
  def my_presigned_post(key, content_type, file_name)
    res = bucket.presigned_post(
      key: key,
      success_action_status: '201',
      acl: 'private',
      content_type: content_type,
      metadata: {
        'original-filename' => file_name
      }
    )

    {
      # Railsをdocker上で動かしている場合、Railsからs3(minio)へアクセスする時のホスト名はs3になる
      # しかし、フロントエンドからアクセスする時のホスト名はlocalhostを使わなければならない
      url: Rails.env.development? ? res.url.gsub('http://s3', 'http://localhost') : res.url,
      fields: res.fields
    }
  end
end

digital_product_content = DigitalProductContent.create!(
  user_id: current_user.id,
  data_file_name: file_name,
  data_content_type: content_type,
)

digital_product_s3_client = DigitalProductS3Client.new
presigned_post = digital_product_s3_client.my_presigned_post(
  digital_product_content.data_object_key,
  digital_product_content.data_content_type,
  digital_product_content.data_file_name,
)

# 以下をクライアントに返す
{
  digital_product_content_id: digital_product_content.id,
  presigned_url: presigned_post[:url],
  fields: presigned_post[:fields]
}

class DigitalProductContent < ApplicationRecord
  class EmptyDataError < StandardError; end
  class DotExtensionError < StandardError; end

  # 省略

  def data_object_key
    if self.id.present? && self.data_file_name.present?
      object_key = "digital_product_contents/data/user-#{self.user_id}/#{self.id}#{dot_extension}"
    else
      raise EmptyDataError
    end
  end

  private

  def dot_extension
    extname = File.extname(self.data_file_name)
    raise DotExtensionError if extname == '.' || extname == ''
    extname
  end
end

    :path: ':class/:attachment/user-:user_id/:id:dotextension'

class DigitalProductS3Client
  # 省略

  def object_headers(object_key)
    object = bucket.object(object_key)

    {
      content_length: object.content_length,
      content_type: object.content_type,
      file_name: object.metadata['original-filename'],
    }
  end
end

digital_product_content = DigitalProductContent
  .where(user_id: context[:current_user].id)
  .find(digital_product_content_id)

digital_product_s3_client = DigitalProductS3Client.new
object_headers =
  digital_product_s3_client.object_headers(digital_product_content.data_object_key)

digital_product_content.update!(
  data_file_size: object_headers[:content_length],
  data_updated_at: Time.zone.now
)

class DigitalProductS3Client
  def my_presigned_post(key, content_type, file_name, content_length_range)
    res = bucket.presigned_post(
      key: key,
      success_action_status: '201',
      content_length_range: 0..1.gigabyte,
      acl: 'private',
      content_type: content_type,
      metadata: {
        'original-filename' => file_name
      }
    )

class DigitalProductContent < ApplicationRecord
  def self.count_in_today(user_id)
    DigitalProductContent
      .where(
        user_id: user_id,
        created_at: Time.zone.today.all_day
      )
      .count
  end