gem "image_processing", ">= 1.2"

$ bin/rails active_storage:install 
$ bin/rails db:migrate

local:
  service: Disk
  root: <%= Rails.root.join("storage") %>

test:
  service: Disk
  root: <%= Rails.root.join("tmp/storage") %>

# AWS 시크릿을 설정하려면 bin/rails credentials:edit를 사용하세요 (aws:access_key_id|secret_access_key 형태로)
amazon:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  bucket: your_own_bucket-<%= Rails.env %>
  region: "" # 예: 'us-east-1'

# 파일을 로컬에 저장합니다.
config.active_storage.service = :local

# Amazon S3에 파일 저장
config.active_storage.service = :amazon

# 업로드된 파일을 로컬 파일시스템의 임시 디렉토리에 저장합니다.
config.active_storage.service = :test

amazon:
  service: S3
  # ...
  bucket: your_own_bucket-<%= Rails.env %>

google:
  service: GCS
  # ...
  bucket: your_own_bucket-<%= Rails.env %>

azure:
  service: AzureStorage
  # ...
  container: your_container_name-<%= Rails.env %>

local:
  service: Disk
  root: <%= Rails.root.join("storage") %>

# AWS secrets를 설정하려면 bin/rails credentials:edit를 사용하세요 (aws:access_key_id|secret_access_key 형식으로)
amazon:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  region: "" # 예시: 'us-east-1'
  bucket: your_own_bucket-<%= Rails.env %>

# AWS secrets를 설정하려면 bin/rails credentials:edit를 사용하세요 (aws:access_key_id|secret_access_key 형식으로)
amazon:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  region: "" # 예) 'us-east-1'
  bucket: your_own_bucket-<%= Rails.env %>
  http_open_timeout: 0
  http_read_timeout: 0
  retry_limit: 0
  upload:
    server_side_encryption: "" # 'aws:kms' 또는 'AES256'
    cache_control: "private, max-age=<%= 1.day.to_i %>"

gem "aws-sdk-s3", require: false

digitalocean:
  service: S3  
  endpoint: https://nyc3.digitaloceanspaces.com
  access_key_id: <%= Rails.application.credentials.dig(:digitalocean, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:digitalocean, :secret_access_key) %>
  # ...그리고 다른 옵션들

azure:
  service: AzureStorage
  storage_account_name: your_account_name
  storage_access_key: your_access_key
  container: your_container_name

azure_test:
  service: AzureStorage
  storage_account_name: your_account_name
  storage_access_key: your_access_key
  container: your_container_name_test

# bin/rails credentials:edit를 사용해서 Azure Storage secret을 설정하세요 (azure_storage:storage_access_key로)
azure:
  service: AzureStorage
  storage_account_name: your_account_name
  storage_access_key: <%= Rails.application.credentials.dig(:azure_storage, :storage_access_key) %>
  container: your_container_name-<%= Rails.env %>

gem "azure-storage-blob", "~> 2.0", require: false

google:
  service: GCS
  project: your-project-id
  credentials: <%= Rails.root.join("path/to/keyfile.json") %>
  bucket: your-bucket-name

google:
  service: GCS
  credentials: <%= Rails.root.join("path/to/keyfile.json") %>
  project: ""
  bucket: 자신의_버킷명-<%= Rails.env %>

# GCS secrets(gcs:private_key_id|private_key)를 설정하려면 bin/rails credentials:edit를 사용하세요
google:
  service: GCS
  credentials:
    type: "service_account"
    project_id: ""
    private_key_id: <%= Rails.application.credentials.dig(:gcs, :private_key_id) %>
    private_key: <%= Rails.application.credentials.dig(:gcs, :private_key).dump %>
    client_email: ""
    client_id: ""
    auth_uri: "https://accounts.google.com/o/oauth2/auth"
    token_uri: "https://accounts.google.com/o/oauth2/token"
    auth_provider_x509_cert_url: "https://www.googleapis.com/oauth2/v1/certs"
    client_x509_cert_url: ""
  project: ""
  bucket: your_own_bucket-<%= Rails.env %>

google:
  service: GCS
  ...
  cache_control: "public, max-age=3600"

google:
  service: GCS
  ...
  iam: true

google:
  service: GCS
  ...
  iam: true
  gsa_email: "foobar@baz.iam.gserviceaccount.com"

gem "google-cloud-storage", "~> 1.11", require: false

# AWS 시크릿(aws:access_key_id|secret_access_key)을 설정하려면 bin/rails credentials:edit를 사용하세요
s3_west_coast:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  region: "" # 예: 'us-west-1'
  bucket: your_own_bucket-<%= Rails.env %>

s3_east_coast:
  service: S3
  access_key_id: <%= Rails.application.credentials.dig(:aws, :access_key_id) %>
  secret_access_key: <%= Rails.application.credentials.dig(:aws, :secret_access_key) %>
  region: "" # 예: 'us-east-1'
  bucket: your_own_bucket-<%= Rails.env %>

production:
  service: Mirror
  primary: s3_east_coast
  mirrors:
    - s3_west_coast

gcs: &gcs
  service: GCS
  project: ""

private_gcs:
  <<: *gcs
  credentials: <%= Rails.root.join("path/to/private_key.json") %>
  bucket: your_own_bucket-<%= Rails.env %> 

public_gcs:
  <<: *gcs
  credentials: <%= Rails.root.join("path/to/public_key.json") %>
  bucket: your_own_bucket-<%= Rails.env %>
  public: true

class User < ApplicationRecord 
  has_one_attached :avatar
end

$ bin/rails generate model User avatar:attachment

<%= form.file_field :avatar %>

class SignupController < ApplicationController
  def create
    user = User.create!(user_params)
    session[:user_id] = user.id
    redirect_to root_path
  end

  private
    def user_params
      params.expect(user: [:email_address, :password, :avatar]) 
    end
end

user.avatar.attach(params[:avatar])

user.avatar.attached?

class User < ApplicationRecord
  has_one_attached :avatar, service: :google
end

class User < ApplicationRecord
  has_one_attached :avatar do |attachable|
    attachable.variant :thumb, resize_to_limit: [100, 100]
  end
end

<%= image_tag user.avatar.variant(:thumb) %>

class User < ApplicationRecord
  has_one_attached :video do |attachable|
    attachable.variant :thumb, resize_to_limit: [100, 100]
  end
end

<%= image_tag user.video.preview(:thumb) %>

class User < ApplicationRecord
  has_one_attached :video do |attachable|
    attachable.variant :thumb, resize_to_limit: [100, 100], preprocessed: true
  end
end

class Message < ApplicationRecord
  has_many_attached :images
end

$ bin/rails generate model Message images:attachments

class MessagesController < ApplicationController
  def create
    message = Message.create!(message_params)
    redirect_to message
  end

  private
    def message_params
      params.expect(message: [ :title, :content, images: [] ])
    end
end

@message.images.attach(params[:images])

@message.images.attached?

class Message < ApplicationRecord
  has_many_attached :images, service: :s3
end

class Message < ApplicationRecord
  has_many_attached :images do |attachable|
    attachable.variant :thumb, resize_to_limit: [100, 100]
  end
end

@message.images.attach(io: File.open("/path/to/file"), filename: "file.pdf")

@message.images.attach(io: File.open("/path/to/file"), filename: "file.pdf", content_type: "application/pdf")

@message.images.attach(
  io: File.open("/path/to/file"),
  filename: "file.pdf", 
  content_type: "application/pdf",
  identify: false
)

@message.images.attach(
  io: File.open("/path/to/file"), 
  filename: "file.pdf",
  content_type: "application/pdf",
  key: "#{Rails.env}/blog_content/intuitive_filename.pdf",
  identify: false
)

def s3_file_key
  "#{Rails.env}/blog_content/intuitive_filename-#{SecureRandom.uuid}.pdf"
end

@message.images.attach(
  io: File.open("/path/to/file"),
  filename: "file.pdf", 
  content_type: "application/pdf",
  key: s3_file_key,
  identify: false # 업로드된 파일에 대한 content type과 메타데이터를 자동으로 파악하는 것을 건너뛰기
)

<% @message.images.each do |image| %>
  <%= form.hidden_field :images, multiple: true, value: image.signed_id %>
<% end %>

<%= form.file_field :images, multiple: true %>

<%= form.hidden_field :avatar, value: @user.avatar.signed_id if @user.avatar.attached? %>
<%= form.file_field :avatar, direct_upload: true %>

# 동기적으로 avatar와 실제 리소스 파일을 삭제합니다.
user.avatar.purge

# Active Job을 통해 연관된 모델과 실제 리소스 파일을 비동기적으로 삭제합니다.
user.avatar.purge_later

url_for(user.avatar)
# => https://www.example.com/rails/active_storage/blobs/redirect/:signed_id/my-avatar.png

rails_blob_path(user.avatar, disposition: "attachment")

Rails.application.routes.url_helpers.rails_blob_path(user.avatar, only_path: true)

# config/initializers/active_storage.rb 
Rails.application.config.active_storage.resolve_model_to_route = :rails_storage_proxy

<%= image_tag rails_storage_proxy_path(@user.avatar) %>

# config/routes.rb
direct :cdn_image do |model, options|
  expires_in = options.delete(:expires_in) { ActiveStorage.urls_expire_in }

  if model.respond_to?(:signed_id)
    route_for(
      :rails_service_blob_proxy, 
      model.signed_id(expires_in: expires_in),
      model.filename,
      options.merge(host: ENV["CDN_HOST"])
    )
  else
    signed_blob_id = model.blob.signed_id(expires_in: expires_in) 
    variation_key = model.variation.key
    filename = model.blob.filename

    route_for(
      :rails_blob_representation_proxy,
      signed_blob_id,  
      variation_key,
      filename,
      options.merge(host: ENV["CDN_HOST"])
    )
  end
end

<%= cdn_image_url(user.avatar.variant(resize_to_limit: [128, 128])) %>

# config/routes.rb
resource :account do
  resource :logo
end

# app/controllers/logos_controller.rb
class LogosController < ApplicationController
  # ApplicationController를 통해:
  # include Authenticate, SetCurrentAccount

  def show
    redirect_to Current.account.logo.url
  end
end

<%= image_tag account_logo_path %>

config.active_storage.draw_routes = false

binary = user.avatar.download

message.video.open do |file|
  system "/path/to/virus/scanner", file.path
  # ...
end

<ul>
  <% @message.files.each do |file| %>
    <li>
      <% if file.representable? %>
        <%= image_tag file.representation(resize_to_limit: [100, 100]) %>
      <% else %>
        <%= link_to rails_blob_path(file, disposition: "attachment") do %>
          <%= image_tag "placeholder.png", alt: "파일 다운로드" %>
        <% end %>
      <% end %>
    </li>
  <% end %>
</ul>

image_tag file.representation(resize_to_limit: [100, 100])

image_tag file.representation(resize_to_limit: [100, 100]).processed.url

message.images.with_all_variant_records.each do |file|
  image_tag file.representation(resize_to_limit: [100, 100]).processed.url
end

<%= image_tag user.avatar.variant(resize_to_limit: [100, 100]) %>

<!-- Vips는 많은 변형에서 `crop` 설정을 지원합니다 -->
<%= image_tag user.avatar.variant(resize_to_fill: [100, 100, { crop: :centre }]) %>

<!-- MiniMagick -->
<%= image_tag user.avatar.variant(resize_to_limit: [100, 100], format: :jpeg, sampling_factor: "4:2:0", strip: true, interlace: "JPEG", colorspace: "sRGB", quality: 80) %>

<!-- Vips -->
<%= image_tag user.avatar.variant(resize_to_limit: [100, 100], format: :jpeg, saver: { subsample_mode: "on", strip: true, interlace: true, quality: 80 }) %> 

config.active_storage.variable_content_types = %w(
  image/png
  image/gif
  image/jpg
  image/jpeg
  image/pjpeg
  image/tiff
  image/bmp
  image/vnd.adobe.photoshop
  image/vnd.microsoft.icon
  image/webp
)

config.active_storage.variant_processor = :mini_magick

bundle add image_processing

config.active_storage.web_image_content_types = %w(
  image/png
  image/jpeg
  image/jpg
  image/gif
)

<%= image_tag message.video.preview(resize_to_limit: [100, 100]) %> 

[
  {
    "AllowedHeaders": [
      "Content-Type", 
      "Content-MD5",
      "Content-Disposition"
    ],
    "AllowedMethods": [
      "PUT"  
    ],
    "AllowedOrigins": [
      "https://www.example.com"
    ],
    "MaxAgeSeconds": 3600
  }
]

<?xml version="1.0" encoding="UTF-8"?>
<CorsConfig>
    <Cors>
        <Origins>
            <Origin>*</Origin>
        </Origins>
        <Methods>
            <Method>GET</Method>
            <Method>POST</Method>
            <Method>PUT</Method>
            <Method>DELETE</Method>
        </Methods>
        <ResponseHeaders>
            <ResponseHeader>x-goog-meta-foo1</ResponseHeader>
            <ResponseHeader>x-goog-meta-foo2</ResponseHeader>
        </ResponseHeaders>
        <MaxAgeSec>3600</MaxAgeSec>
    </Cors>
</CorsConfig>

[
  {
    "origin": ["https://www.example.com"],
    "method": ["PUT"], 
    "responseHeader": ["Content-Type", "Content-MD5", "Content-Disposition"],
    "maxAgeSeconds": 3600
  }
]

<Cors>
  <CorsRule>
    <AllowedOrigins>http://www.example.com</AllowedOrigins>
    <AllowedMethods>PUT,GET</AllowedMethods>
    <AllowedHeaders>*</AllowedHeaders>
    <ExposedHeaders>*</ExposedHeaders>
    <MaxAgeInSeconds>3000</MaxAgeInSeconds>
  </CorsRule>
</Cors>

<Cors>
  <CorsRule>
    <AllowedOrigins>https://www.example.com</AllowedOrigins>
    <AllowedMethods>PUT</AllowedMethods> 
    <AllowedHeaders>Content-Type, Content-MD5, x-ms-blob-content-disposition, x-ms-blob-type</AllowedHeaders>
    <MaxAgeInSeconds>3600</MaxAgeInSeconds>
  </CorsRule>
</Cors>

// direct_uploads.js

addEventListener("direct-upload:initialize", event => {
  const { target, detail } = event
  const { id, file } = detail
  target.insertAdjacentHTML("beforebegin", `
    <div id="direct-upload-${id}" class="direct-upload direct-upload--pending">
      <div id="direct-upload-progress-${id}" class="direct-upload__progress" style="width: 0%"></div>
      <span class="direct-upload__filename"></span>
    </div>
  `)
  target.previousElementSibling.querySelector(`.direct-upload__filename`).textContent = file.name
})

addEventListener("direct-upload:start", event => {
  const { id } = event.detail
  const element = document.getElementById(`direct-upload-${id}`) 
  element.classList.remove("direct-upload--pending")
})

addEventListener("direct-upload:progress", event => {
  const { id, progress } = event.detail
  const progressElement = document.getElementById(`direct-upload-progress-${id}`)
  progressElement.style.width = `${progress}%`
})

addEventListener("direct-upload:error", event => {
  event.preventDefault()
  const { id, error } = event.detail
  const element = document.getElementById(`direct-upload-${id}`)
  element.classList.add("direct-upload--error")
  element.setAttribute("title", error)
})

addEventListener("direct-upload:end", event => {
  const { id } = event.detail
  const element = document.getElementById(`direct-upload-${id}`)
  element.classList.add("direct-upload--complete") 
})

import { DirectUpload } from "@rails/activestorage"

const input = document.querySelector('input[type=file]')

// 파일 드롭에 바인딩 - 부모 요소에 ondrop을 사용하거나 
// Dropzone과 같은 라이브러리 사용
const onDrop = (event) => {
  event.preventDefault()
  const files = event.dataTransfer.files;
  Array.from(files).forEach(file => uploadFile(file))
}

// 일반적인 파일 선택에 바인딩
input.addEventListener('change', (event) => {
  Array.from(input.files).forEach(file => uploadFile(file))
  // input에서 선택된 파일들을 지울 수 있습니다
  input.value = null
})

const uploadFile = (file) => {
  // form에 file_field direct_upload: true가 필요하며,
  // 이는 data-direct-upload-url을 제공합니다
  const url = input.dataset.directUploadUrl
  const upload = new DirectUpload(file, url)

  upload.create((error, blob) => {
    if (error) {
      // 에러 처리
    } else {
      // blob.signed_id 값을 가진 적절한 이름의 hidden input을
      // form에 추가하여 일반적인 업로드 흐름에서 
      // blob id가 전송되도록 합니다
      const hiddenField = document.createElement('input')
      hiddenField.setAttribute("type", "hidden");
      hiddenField.setAttribute("value", blob.signed_id);
      hiddenField.name = input.name
      document.querySelector('form').appendChild(hiddenField)
    }
  })
}

import { DirectUpload } from "@rails/activestorage"

class Uploader {
  constructor(file, url) {
    this.upload = new DirectUpload(file, url, this)
  }

  uploadFile(file) {
    this.upload.create((error, blob) => {
      if (error) {
        // 에러를 처리합니다
      } else {
        // blob.signed_id 값을 가진 적절한 이름의 
        // hidden input을 form에 추가합니다
      }
    })
  }

  directUploadWillStoreFileWithXHR(request) {
    request.upload.addEventListener("progress",
      event => this.directUploadDidProgress(event))
  }

  directUploadDidProgress(event) {
    // event.loaded와 event.total을 사용하여 진행 표시줄을 업데이트합니다
  }
}

import { DirectUpload } from "@rails/activestorage"

class Uploader {
  constructor(file, url, token) {
    const headers = { 'Authentication': `Bearer ${token}` }
    // INFO: headers 전송은 선택적인 매개변수입니다. 헤더를 보내지 않기로 선택하면,
    //       인증은 쿠키나 세션 데이터를 사용해 수행됩니다.
    this.upload = new DirectUpload(file, url, this, headers)
  }

  uploadFile(file) {
    this.upload.create((error, blob) => {
      if (error) {
        // 에러 처리
      } else {
        // 다음 요청에서 blob.signed_id를 파일 참조로 사용
      }
    })
  }

  directUploadWillStoreFileWithXHR(request) {
    request.upload.addEventListener("progress",
      event => this.directUploadDidProgress(event))
  }

  directUploadDidProgress(event) {
    // event.loaded와 event.total을 사용하여 진행 막대 업데이트 
  }
}

class DirectUploadsController < ActiveStorage::DirectUploadsController
  skip_forgery_protection
  before_action :authenticate!

  def authenticate!
    @token = request.headers["Authorization"]&.split&.last

    유효한 토큰이 아닐 경우 unauthorized를 반환합니다
    head :unauthorized unless valid_token?(@token)
  end
end

class SignupController < ActionDispatch::IntegrationTest
  test "회원가입이 가능한지" do
    post signup_path, params: {
      name: "David", 
      avatar: file_fixture_upload("david.png", "image/png")
    }

    user = User.order(:created_at).last
    assert user.avatar.attached?
  end
end

class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
  # ...
  def after_teardown
    super
    FileUtils.rm_rf(ActiveStorage::Blob.service.root)
  end
  # ...
end

class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
  # ...
  parallelize_setup do |i|
    ActiveStorage::Blob.service.root = "#{ActiveStorage::Blob.service.root}-#{i}"
  end
  # ...
end

# 즉시 처리되도록 inline job 처리를 사용
config.active_job.queue_adapter = :inline

class ActionDispatch::IntegrationTest
  def after_teardown
    super
    FileUtils.rm_rf(ActiveStorage::Blob.service.root)
  end
end

class ActionDispatch::IntegrationTest
  parallelize_setup do |i|
    ActiveStorage::Blob.service.root = "#{ActiveStorage::Blob.service.root}-#{i}"
  end
end

# config/storage.yml

test_fixtures:
  service: Disk
  root: <%= Rails.root.join("tmp/storage_fixtures") %>

# active_storage/attachments.yml
david_avatar:
  name: avatar
  record: david (User) 
  blob: david_avatar_blob

# active_storage/blobs.yml
david_avatar_blob: <%= ActiveStorage::FixtureSet.blob filename: "david.png", service_name: "test_fixtures" %>

class UserTest < ActiveSupport::TestCase
  def test_avatar
    avatar = users(:david).avatar

    assert avatar.attached?  
    assert_not_nil avatar.download
    assert_equal 1000, avatar.byte_size
  end
end

class ActiveSupport::TestCase
  # ...
  parallelize_teardown do |i|
    FileUtils.rm_rf(ActiveStorage::Blob.services.fetch(:test_fixtures).root)
  end
  # ...
end

# test_helper.rb

Minitest.after_run do
  FileUtils.rm_rf(ActiveStorage::Blob.services.fetch(:test_fixtures).root)
end

class User < ApplicationRecord
  has_one_attached :avatar, service: :s3
end

test:
  service: Disk
  root: <%= Rails.root.join("tmp/storage") %>

s3:
  service: Disk
  root: <%= Rails.root.join("tmp/storage") %>

namespace :active_storage do
  desc "연결되지 않은 Active Storage blob들을 제거합니다. 정기적으로 실행하세요."
  task purge_unattached: :environment do
    ActiveStorage::Blob.unattached.where(created_at: ..2.days.ago).find_each(&:purge_later)
  end
end