【django】アップロード画像を表示できない原因
djangoでアップロード画像の表示に苦戦したので、表示できない原因を残しておきます。
開発環境
前提条件
- FileField、ImageFieldなどを利用して画像アップロードができていること
画像を表示できない原因
1. settings.pyのMEDIA_ROOTとMEDIA_URLの設定が間違っている
MEDIA_ROOT→アップロードファイルを保存する場所を指定
アップロードした画像はMEDIA_ROOTで指定したディレクトリ内のupload_atで指定したフォルダ内に保存される。
MEDIA_URL→メディアディレクトリの公開用URLを指定
例えば、
MEDIA_URL='/media/'とした場合、
http://127.0.0.1:8000/media/{画像名}が画像を表示するための公開用URLになる。
2. {アプリ名}/urls.pyにstate()文を追加
urls.pyにstate(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)を入れることで
MEDIA_ROOTのディレクトリ内のファイルをMEDIA_URL起点のurlでアクセスできるようになる。
これがないと一致するURLパターンがないため、エラーとなると思う。
追加方法は以下の通り。
urlpattern = [ ・・・ ] + state(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
3. htmlのimgやaタグのリンクに画像までのパスを指定する（私はこれが原因でした）
最後にhtmlファイルでimgやaタグを利用して画像を表示する。
imgのsrcやaのhrefには、アプリ名+MEDIA_ROOTを起点とした画像までのパスを指定する。
<img src="/{appname}/{画像ファイルへのパス}">
<a href="/{appname}/{画像ファイルへのパス}" download="output">
