↓↓クリックして頂けると励みになります。
【20 | Dropzoneの利用】 << 【ホーム】 >> 【22 | Action Text】
Amazon S3(Simple Storage Service)は、Amazon Web Services(AWS)のクラウドストレージサービスの1つです。
S3は、データの保存、バックアップ、アーカイブ、データの配信など、さまざまなデータストレージ関連の用途に使用されます。
herokuにアプリケーションをデプロイすると画像をローカルに保存することができません。
それに対応するため、アップロードした画像を全てアマゾンS3に保存するよう設定します。
アマゾンS3のキーの取得方法は以下の手順でお願いします。
mrradiology.hatenablog.jp
GemFileに以下の記述を追加して下さい。
記述追加 GemFile(82行目)
gem 'aws-sdk', '~> 3.1'
GemFile
source "https://rubygems.org" ruby "3.1.2" # Bundle edge Rails instead: gem "rails", github: "rails/rails", branch: "main" gem "rails", "~> 7.1.1" # The original asset pipeline for Rails [https://github.com/rails/sprockets-rails] gem "sprockets-rails" # Use postgresql as the database for Active Record gem "pg", "~> 1.1" # Use the Puma web server [https://github.com/puma/puma] gem "puma", ">= 5.0" # Use JavaScript with ESM import maps [https://github.com/rails/importmap-rails] gem "importmap-rails" # Hotwire's SPA-like page accelerator [https://turbo.hotwired.dev] gem "turbo-rails" # Hotwire's modest JavaScript framework [https://stimulus.hotwired.dev] gem "stimulus-rails" # Build JSON APIs with ease [https://github.com/rails/jbuilder] gem "jbuilder" # Use Redis adapter to run Action Cable in production gem "redis", ">= 4.0.1" # Use Kredis to get higher-level data types in Redis [https://github.com/rails/kredis] # gem "kredis" # Use Active Model has_secure_password [https://guides.rubyonrails.org/active_model_basics.html#securepassword] # gem "bcrypt", "~> 3.1.7" # Windows does not include zoneinfo files, so bundle the tzinfo-data gem gem "tzinfo-data", platforms: %i[ mswin mswin64 mingw x64_mingw jruby ] # Reduces boot times through caching; required in config/boot.rb gem "bootsnap", require: false # Use Active Storage variants [https://guides.rubyonrails.org/active_storage_overview.html#transforming-images] gem "image_processing", "~> 1.2" group :development, :test do # See https://guides.rubyonrails.org/debugging_rails_applications.html#debugging-with-the-debug-gem gem "debug", platforms: %i[ mri mswin mswin64 mingw x64_mingw ] end group :development do # Use console on exceptions pages [https://github.com/rails/web-console] gem "web-console" # Add speed badges [https://github.com/MiniProfiler/rack-mini-profiler] # gem "rack-mini-profiler" # Speed up commands on slow machines / big apps [https://github.com/rails/spring] # gem "spring" gem "error_highlight", ">= 0.4.0", platforms: [:ruby] end group :test do # Use system testing [https://guides.rubyonrails.org/testing.html#system-testing] gem "capybara" gem "selenium-webdriver" end # bootstrap5 gem 'bootstrap', '~> 5.3', '>= 5.3.2' gem 'sassc-rails', '~> 2.1', '>= 2.1.2' # device gem 'devise', '~> 4.8', '>= 4.8.1' # 日本語化 gem 'rails-i18n', '~> 7.0', '>= 7.0.8' # Amazon S3 gem 'aws-sdk', '~> 3.1'
コマンド
bundle
「config\environments\development.rb」ファイルの記述を更新します。
記述更新 config\environments\development.rb
37行目の「config.active_storage.service = :local」の記述を「:amazon」に変更します。
# config.active_storage.service = :local config.active_storage.service = :amazon
「config\storage.yml」ファイルに以下の記述を追加します。
記述追加 config\storage.yml(9行目)
アクセスキー、シークレットキー、バケット名はご自分のものを入れて下さい。
amazon: service: S3 access_key_id: 'ご自分のアクセスキーを入れてください。' secret_access_key: 'ご自分のシークレットアクセスキーを入れてください。' region: "ap-northeast-1" bucket: "ご自分のバケット名を入れてください。"
config\storage.yml
test: service: Disk root: <%= Rails.root.join("tmp/storage") %> local: service: Disk root: <%= Rails.root.join("storage") %> amazon: service: S3 access_key_id: 'ご自分のアクセスキーを入れてください。' secret_access_key: 'ご自分のシークレットアクセスキーを入れてください。' region: "ap-northeast-1" bucket: "ご自分のバケット名を入れてください。" # Use bin/rails credentials:edit to set the AWS secrets (as 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 %> # Remember not to checkin your GCS keyfile to a repository # google: # service: GCS # project: your_project # credentials: <%= Rails.root.join("path/to/gcs.keyfile") %> # bucket: your_own_bucket-<%= Rails.env %> # Use bin/rails credentials:edit to set the Azure Storage secret (as azure_storage:storage_access_key) # microsoft: # 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 %> # mirror: # service: Mirror # primary: local # mirrors: [ amazon, google, microsoft ]
ブラウザ確認
http://localhost:3000/dashboard
画像をアップロードすると画像が表示されます。
アマゾンS3のバケットを見て画像がアップロードされているか確認して下さい。
【20 | Dropzoneの利用】 << 【ホーム】 >> 【22 | Action Text】
↓↓クリックして頂けると励みになります。