AWS S3 に画像が保存されない。

Question

前提・実現したいこと

Qiita記事等1、2を参考にしながら、ローカル環境および Heroku のステージング環境にてアップロードした画像を AWS S3 に保存するよう設定致しました。

設定後、両環境にて画像のアップロードを試したところ、AWS S3 に上手く保存出来ておりませんでした。そちらは以下の方法にて確認致しました。

• アップロードした画像を右クリック → 画像アドレスをコピーしたところ、それぞれの環境で画像アドレスが以下になっていた。

http://localhost:3000/user_images/1.jpg（ローカル環境）
https://アプリ名.herokuapp.com/user_images/1.jpg（Heroku のステージング環境）

• AWS S3 のバケット > オブジェクトを確認しても、何もレコードを確認出来なかった。

尚、アップロード時に特にエラーは発生しませんでした。

該当のソースコード

config/environment/deveropment.rb

  config.active_storage.service = :amazon

config/environment/production.rb

  config.active_storage.service = :amazon

config/environment/storage.yml

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: ap-northeast-1 #東京
  bucket: S3 のバケット名

試したこと

前述の参考サイトの手順とやや異なった事と言えば、私の環境は Windows11 ですので、アクセスキーを設定する際に Vim をインストールし環境設定の編集も同時に済ませた事くらいです。

ただ rails credentials:show で設定を確認した所以下の様に上手く表示されましたので、その点は問題ないと思いました。

C:\Users\ユーザー名\app\アプリ名>rails credentials:show
aws: 
　access_key_id: AKIAZEMNWDXHF…（省略）
　secret_access_key: zirfU8ftVfM1cbR…（省略）

secret_key_base: d6019fca51c34eba5cb6eb2a5d7027d7d60f…（省略）

どなたかご助言を頂けますと有難いです。

補足情報（FW/ツールのバージョンなど）

ruby 2.6.8p205 (2021-07-07 revision 67951) [x64-mingw32]
RubyGems 3.0.3.1
Rails 5.2.6
heroku/7.59.2 win32-x64 node-v12.21.0
VIM - Vi IMproved 8.2

画像周りのコードの追記

users_controller.rb

class UsersController < ApplicationController
  def update
    @user = User.find_by(id: params[:id])
    @user.name = params[:name]
    if params[:image]
      @user.image_name = "#{@user.id}.jpg"
      image = params[:image]
      File.binwrite("public/user_images/#{@user.image_name}", image.read)
    end
    if params[:cover_image]
      @user.cover_image_name = "#{@user.id}_cover.jpg"
      cover_image = params[:cover_image]
      File.binwrite("public/user_cover_images/#{@user.cover_image_name}", cover_image.read)
    end
    if @user.save
      flash[:notice] = "You have successfully updated your profile"
      redirect_to("/users/#{@user.id}")
    else
      render("users/edit")
    end
  end
end

users/edit.html.erb

<%= form_tag("/users/#{@user.id}/update", {multipart: true}) do %>
<ul>
  <li>
    <div class="col-1">User name</div>
    <div class="col-2"><input size="40" name="name" maxlength=30 value="<%= @user.name %>"></div>
  </li>
  <li>
    <div class="col-1">Profile picture</div>
    <div class="col-2">
      <input name="image" type="file" accept=".png, .jpg, .jpeg, .gif" id="file_photo" class="file_photo" value="<%= @user.image_name %>"> 
    </div><br>
    <div class="col-1"></div>      
    <div class="col-2 valid-note">*Please select a file when you need to change the current one.</div>
  </li> 
  <li>
    <div class="col-1">Cover picture</div>
    <div class="col-2">
      <input name="cover_image" type="file" accept=".png, .jpg, .jpeg, .gif" id="file_photo2" class="file_photo">
    </div><br>
    <div class="col-1"></div>      
    <div class="col-2 valid-note">*Please select a file when you need to change the current one.</div>
  </li> 
  </li>
</ul>
<% end %>

Comments

[yu_1985]

rails credentials:showの内容は本当にそのとおりですか？
だとしたらインデントがおかしいと思いますが…。

[punchan36]

失礼致しました。質問文を書いている最中に誤ってインデントまで消してしまっておりました。
正しい内容に編集致しました。

[yu_1985]

Herokuは使わないのでよくわかりませんが、Rails.envがstagingなのであればstaging用の設定を入れないといけないのではないでしょうか。
また、ローカルではRails.envはどう指定していますか。
見た感じproduction.rbとenvironment.rb（この名前で有効なのかは知りませんが）しかないように見えますが、Rails.envで指定されている環境の設定はちゃんと入ってますか？

[punchan36]

返信が遅くなり申し訳ありません。
https://pote-chil.com/rails_heroku_aws-s3/
こちらの記事を参考に S3 の設定を進めていたのですが、ここには書かれていない Active Storage と言う物を Rails 側で使わないと反映されないのですか？
他の記事では S3 と Active Storage がセットで書かれておりましたので気になりました…。

現状の画像周りのコードを追記致しましたが、設定に応じてこちらも全面的に変える必要が出てくるのでしょうか…？（保存先がAWS S3 ではなくローカルになってしまいますが、それ以外の挙動は問題がないコードです。）

また、申し訳ありません。
「ローカルでのRails.envの指定」と言う部分がよく分かりませんでした。設定に関して編集したファイルは前述の production.rb、environment.rb、storage.yml くらいですが、他にも編集すべき項目があるのでしょうか？

[yu_1985]

ActiveStorageについては参考にしていQiitaの記事のも記載されているはずですが…。
逆に、ActiveStorageを使わないならなぜActiveStorageの設定をしているのでしょうか

> config.active_storage.service = :amazon

以前はCarrierWaveというgemを使ってやることが多かったようですが、Railsの標準gemであるActiveStorageがS3に対応したのでそちらを使うことが現在は多そうです。

古めの記事にはActiveStorageを明示的にインストールすることが書いてありますが、最近の記事やRails Guide等には特に記載がないので標準で入っているかもしれません。
この辺は今の標準がどうなのかわからないのでなんとも言えませんが、気になるなら明示的に入れてみるといいでしょう。

Rails.envを何も指定しないでローカルで起動するとデフォルトだとdevelopmentになると思いますが…。
Rails.envのことを知らないなら、ステージングという言葉はどこから出てきたのでしょうか。自分で定義しないといけないと思うのですが。
指定したenvで必要な情報が設定されていないからでは、と書いてあります。
また、environmentという名前の環境はふつう使わないと思いますが、どこから出てきたのでしょうか。参考にしているサイトにもdevelopmentと記載されているはずです。

全体的に、色々やる前にまずRailsの基本的な動かし方をちゃんと確認したほうが良いかなと思います。

[punchan36]

失礼致しました。
environment.rb ではなく deveropment.rb の書き間違いでした。
またHerokuにデプロイした物のうち、まだ公開せず不具合のチェックを行っている段階のものをステージング環境と呼んでおりました。

仰る様に、内容を理解せず手順通りに機械的に入力していた部分がありましたので、もう少しよく考えようと思います。

Qiita を見てみると、ActiveStorage 用にコードを書く場合 form_tag ではなく form_with を使用されていますね…。
コードを大々的に変える必要がありそうですので、もし行き詰りましたら別途質問を立てるかもしれません。

Answer 1

単純に、コントローラやビューにてActiveStorage 用のコードを書いていなかった為データの受け渡しが出来ていなかったのが原因でした。
質問文に載せておりました AWS S3 - Rails 間の設定に関しては問題がありませんでした。

尚 form_tag を使用した Active Storage への画像保存の仕方は他の質問を参考にしました。
基本的な部分が出来ておりませんでした。お騒がせしてしまい申し訳ありませんでした。

users_controller.rb

def update
  @user = User.find_by(id: params[:id])
  @user.name = params[:name]
  if params[:image]
    @user.image_name = params[:image] #変更。
  end
  if params[:cover_image]
    @user.cover_image_name =  params[:cover_image] #変更。
  end
  if @user.save
    flash[:notice] = "You have successfully updated your profile"
    redirect_to("/users/#{@user.id}")
  else
    render("users/edit")
  end
end

def create
  @user = User.new(
    name: params[:name],
    image_name: nil, #image_name: "default_user.jpg", から変更。
    cover_image_name: nil, #cover_image_name: "default_cover_user.jpg", から変更。
  )
  if @user.save
    SignupMailer.send_signup(@user).deliver
    session[:user_id] = @user.id
    flash[:notice] = "Your account has been successfully created"
    redirect_to("/users/#{@user.id}")
  else
    render("users/new")
  end
end    

users/show.html.erb

<%= image_tag "/user_cover_images/#{@user.cover_image_name}", class:"cover-photo" %> 
<%= image_tag "/user_images/#{@user.image_name}", class:"photo" %>

↓

<% if @user.cover_image_name.attached? %> 
  <%= image_tag @user.cover_image_name, class:"cover-photo" %> 
<% else %> 
  <%= image_tag ("/user_cover_images/default_cover_user.jpg"), class:"cover-photo" %> 
<% end %>

<% if @user.image_name.attached? %> 
  <%= image_tag @user.image_name, class:"photo" %> 
<% else %> 
  <%= image_tag ("/user_images/default_user.jpg"), class:"photo" %>         
<% end %>