Как вывести изображения в шаблоне?

Question

[Илья Оськин]

Добрый день, пробую сделать сайт на Django, хочу вывести на главную страницу кейсы с их превью, но тестовый сервер Django каждый раз отвечает 404 ошибкой. (Django 1.9)
Перерыл уже все форумы и документацию по Джанго, но решения так и не нашёл.

В браузере экранируется такой урл: 127.0.0.1:8000/static/media/images/2.jpg
BASE_DIR имеет такой вид: BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(file)))
Папка static лежит в корне каталога, по соседству c папкой приложения и проекта, manage.py и тд

models.py

from django.db import models

class Case(models.Model):
    case_name = models.CharField(max_length=30)
    case_preview = models.ImageField(upload_to='images')

    def __str__(self):
        return self.case_name

settings.py

STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
STATIC_URL = '/static/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'static/media/')
MEDIA_URL = '/static/media/'

urls.py (который лежит в директории проекта, а не приложения)

from django.conf.urls import patterns, include, url
from django.conf.urls.static import static
from django.contrib import admin
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.conf import settings

urlpatterns = patterns('',
    url(r'^landing/', include('landing.urls', namespace="landing")),
    url(r'^admin/', admin.site.urls),
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

views.py

from django.shortcuts import get_object_or_404, render
from django.views import generic

from .models import Case

class IndexView(generic.ListView):
    template_name = 'landing/index.html'
    context_object_name = 'case_list'

    def get_queryset(self):
        return Case.objects.all()

index.html

{% if case_list %}
    <ul>
    {% for case in case_list %}
        <img src="{{ MEDIA_URL }}{{ case.case_preview.url }}"/>
        <li>{{ case.case_name }}</li>
    {% endfor %}
    </ul>
{% else %}
    <p>No cases are available.</p>
{% endif %}

При этом путь до изображения на диске верен:

>>> c = Case(case_name="Pic", case_preview="images/2.jpg")
>>> c.save()
>>> c.case_preview
<ImageFieldFile: images/2.jpg>
>>> c.case_preview.path
'C:\\Users\\Oskin\\Desktop\\pyProject\\uni\\static\\media\\images\\2.jpg'
>>> c.case_preview.url
'/static/media/images/2.jpg'
>>>

Comments

[Виктор Мельников]

Какой в итоге путь у вас выдает в шаблоне для изображения?

[Илья Оськин]

127.0.0.1:8000/static/media/images/2.jpg

Answer 1

[Илья Оськин]

Наконец, нашёл решение проблемы - не использовать вложение папки media в static
было так:

STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
STATIC_URL = '/static/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'static/media/')
MEDIA_URL = '/static/media/'

А надо так:

STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
STATIC_URL = '/static/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
MEDIA_URL = '/media/'

Answer 2

[Вячеслав]

В index.html нужно добавить:
{% load staticfiles %}
img src="{% static "my_app/myexample.jpg" %}"

Comments

[Илья Оськин]

Всё-равно не работает(
Тем более таким способом придётся задавать в шаблоне урл для каждой картинки вручную,
у меня же итерация каждого кейса из бд:
{% for case in case_list %}
img src="{{ MEDIA_URL }}{{ case.case_preview.url }}"
li {{ case.case_name }} li
{% endfor %}

Answer 3

[Keofaste]

{{ MEDIA_URL }} в шаблоне не нужно в данном случае.
Для проверки url достаточно открыть сгенерированный html в браузере.

Comments

[Илья Оськин]

Да я уже и с и без него пробовал - в результате всё-равно один и тот же урл формируется