@uraoka_yutaro (祐太朗浦岡)posted at 2020-11-20

TOPページで表示される画像が他のページだと表示されない。

Q&A

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
（例）Ruby on railsでtwitterのようなシステムを作っています。
画像を表示させるための実装中に画像が表示出来なくなりました。

S3導入前は画像は表示されていました。
TOPページの画像表記の記述もエラーになっていたため、
改善し、TOPページは問題なく表示されるようになりました。

発生している問題・エラーメッセージ

画像を表示することが出来ない。

該当のソースコード

_show.html.erb
<div class ="contents row">
  <%# <div class="content_post" style="background-image: url(<%= image_tag item.image ,class: 'item-image' if item.image.attached?  %>);"> %>
  <div class="content_post" style="background-image: url(<%= @item.image %>);">
   <% if user_signed_in? && current_user.id == @item.user_id %>
    <div class="more">
      <span><%= image_tag 'arrow_top.png' %></span>
      <ul class="more_list">
        <li>
          <%= link_to '編集', edit_item_path(@item.id), method: :get %>
        </li>
        <li>
          <%= link_to '削除', item_path(@item.id), method: :delete %>
        </li>
      </ul>
    </div>
  <% end %>
    <p><%= @item.text %></p>
    <span class="name">
      <a href="/users/<%= @item.user.id %>">
        <span>投稿者</span><%= @item.user.nickname %>
      </a>
    </span>
  </div>
</div>

試したこと

_item.html.erb

<div class="content_post" style="background-image: url(<%= @item.image %>);">
➡︎コードを変更<div class="content_post" style="background-image: url(<%= url_for(item.image) %>) ;">

コードを変更しても表記は両方ともされなかったです。

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

_item.html.erb
<div class="content_post" style="background-image: url(<%= url_for(item.image) %>) ;">
      <div class="more">
        <span><%= image_tag 'arrow_top.png'%></span>
        <ul class="more_list">
          <li>
            <%= link_to '詳細', item_path(item.id), method: :get%>
          </li>
        <% if user_signed_in? && current_user.id == item.user_id %>
          <li>
            <%= link_to '削除', item_path(item.id), method: :delete %>
          </li>
          <li>
            <%= link_to '編集',edit_item_path(item.id), method: :get %>
          </li>
        <% end %>
        </ul> 
       </div>    
      <p><%= item.text %></p>
      <span class="name">
        <a href="/users/<%= item.user.id %>">
          <span>投稿者</span><%= item.user.nickname %>
        </a>
      </span>
    </div>

このコードでTOPページの画像は表示されていました。

補足情報追加11/18 12:03
```
S3はバケットを作成して、バケットポリシーを編集、
Gemfieにgem "aws-sdk-s3", require: falseをbundle installしました。
その後config/enviroments/delopment.rbにconfig.active_storage.service = :amazonにlocalから変更。

次に「パブリックアクセスをすべてブロック」のチェックを外す。
新規のパブリックバケットポリシー,任意のバケットポリシーにチェックを入れました。

config/storage.ymlに追記
amazon:
service: S3
access_key_id: <%= ENV['AWS_ACCESS_KEY_ID'] %>
secret_access_key: <%= ENV['AWS_SECRET_ACCESS_KEY'] %>
region: ap-northeast-1
bucket: 自身のバケット名

環境設定
config/enviloment/developments.rb
最後の記述
# default_url_options[:host] = "localhost:3000"
host = 'samplehost'
Rails.application.routes.default_url_options[:host] = host
#おそらく本番環境productionにも定義
ここを記載してlocalでは表示させることが出来ました。
url_forメソッドを使用して
```

Are you sure you want to delete the question?