技術

[Rails] image_tagを使わずにassets内の画像を指定する方法

投稿日:2019年8月4日 更新日:

こんにちは。さとうです。

今回はimage_tagを使わずにassets内の画像を指定する方法についてです。

結論

image_path("test.png")

上記のようにimage_path() を使えばOKです!

/assets/images/test.png のように直接指定するのはNGです。

もう少し詳しく

まず、Railsでコンパイルされたファイルには以下のようにハッシュ値が付与されます。

test-3e1de2bb6a447def67a92dedb2319d09211ea20b88b84dda2cef238180c69abc.png

このファイルを画面で表示するときにはimage_tag を使います。
image_tag<img>タグに画像URLを入れて表示してくれます。
このときに-3e1de2... というハッシュ値を気にする必要はありません。

image_tag("test.png")
# => <img src="http://example.com/assets/test.png">

そして今回の記事で紹介したimage_path は画像のパスだけを表示します。
もちろんハッシュ値を気にする必要はありません。

image_path("test.png")
# => "/assets/test.png"

おわりに

Railsでは直接assets からのパスを書いても反映されません。
必ずActionView::Helpers::AssetUrlHelperを使うようにしましょう。という自分への戒めも含めて記事に残しておきます。

-技術

執筆者:


comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

【Angular7】ファイルの指定をルート相対パスにする

こんにちは Angularで別ファイル(例えばcomponentからservic …

no image

[Rails] deviseのパスワード認証を半角英数字だけ許可する

こんばんは ログイン機能を作る時ってdeviseが便利ですよね。 ですが、デフォ …

docomo雑談対話APIを使って会話BOTを作りました。(LINE BOT + Heroku + Rails + docomo雑談API)

こんばんは 前回、LINE BOTを無料で試してみました。heroku + Ra …

ブラウザでRailsのrouting設定を確認する

こんにちは Railsでroutingを確認する時、コマンドでrails rou …

Sequel Proで本番DBに接続できない!

こんにちは。たなかです。 最近はDIY記事ばかりでしたので、久々にエラー解消記事 …