技術

[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 を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

SwiftSwitch @ Raspberry Pi 3(ラズベリーパイ)

誕生日ということで会社からRaspberry Pi 3を頂きました! とりあえず …

no image

[TypeScript]enumを代入記法で書いた場合に、値からキーが取れるか調べてみた。

TypeScriptのenumのドキュメント(TypeScript Deep D …

no image

【Rails】helperからbrタグを含めた文字列を返したい時

こんにちは プライベートではもっぱらRailsを触っています。 触ってからそんな …

no image

RxJSを覚える時に参考にしたサイトまとめ

こんばんは 弊社ではAngularを使用する機会が多いです。 Angularを使 …

[Rails] バージョン上げるときに気をつけること

どうも中田です。 セキュリティ診断とかで引っかかってrailsのバージョンあげた …