Django imageField url on html

Question

I've this hiearchy:

-mega_series
   -mega_series
   -series
      -models.py
      -views.py
      ...
   -manage.py
   -media
      -covers
   -static

The MEDIA_URL AND MEDIA_ROOT are the following:

MEDIA_ROOT = '/Users/lechucico/Documents/mega_series/media/'
MEDIA_URL = 'media/'

On the model I store the image like that:

class Serie (models.Model):
   serie_cover = models.ImageField(upload_to='covers')
   serie_name = models.CharField(max_length=100)

The images once uploaded via admin site goes correctly to path: mega_series/media/covers/

And this is how I acces it via html:

<img src="{{serie.serie_cover.url}}" width="150" height="250" />

The result url that I got is the following:

http://127.0.0.1:8000/media/covers/juego_de_tronos.jpg

Why the image doesn't appear on the html?

Thanks.

@Niyojan - Might want to put that as the answer, as it's the most likely cause — Jens Astrup, Feb 20 '17 at 23:29
@Niyojan I don't have MEDIA_ROOT and MEDIA_URL. serie.serie_cover.url produces the same result. — Lechucico, Feb 20 '17 at 23:33

score 1 · Accepted Answer · edited May 23 '17 at 12:16

1

You would need to define MEDIA_ROOT as mentioned here

From Django officaal Docs:

urlpatterns = [
# ... the rest of your URLconf goes here ...
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

You can also have a look at this.

edited May 23 '17 at 12:16

Community

answered Feb 20 '17 at 23:55

Niyojan

I've edited the post with the instructions you gave me on the link. I think i'm close now but it stills not work. What i've done wrong this time? – Lechucico Feb 21 '17 at 14:58
well, the url seems legit to me and browser should load it. try to check the browser console log (`F12` key for google chrome) for loading errors. Also try with only `serie.serie.name` – Niyojan Feb 21 '17 at 16:05
I've tried: serie.serie.name, serie.serie.url, serie.serie.path and no one works. Terminal console shows the following when loading page: "GET /Users/lechucico/Documents/mega_series/media/covers/modern_family.jpg HTTP/1.1" 404 3218 , Not Found: /Users/lechucico/Documents/mega_series/media/covers/the_black_list.jpg. It's so rare, because the image is on that path – Lechucico Feb 21 '17 at 16:14
I forgot to do add the static on the url.py (+ static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)). Why this is needed to be added? – Lechucico Feb 21 '17 at 20:24
thats a helper function so that django urls list also contains our media url and we can explore them. – Niyojan Feb 22 '17 at 00:02

1 Answers1