Django, браузер отображает имя файла вместо картинки

Question

Мне не хватает какого-либо элемента для отображения изображения, связанного с каждым сообщением в блоге, созданном с помощью Django, вместо имени файла изображения.

Многие решения этой проблемы были:

<img src="{{Object.picture.url}}"/>

На шаблоне я пробовал:

1

<img src="{{ posts.title_picture.url }}"/>

2

<img src="{{title_picture.url}}"/>

Что привело соответственно к отображению в браузере:

1

pictureforpost1.png

2

1022 * IMG *

Модель:

class Post(models.Model):
    title = models.CharField(max_length=255, blank=True, null=True)
    title_picture = models.FileField(blank=True,null=True)

вид:

class IndexView(ListView):
    model = Post
    context_object_name = 'posts'

Похоже, Джанго находит файл. Просто не отображается картинка.

**** Решение благодаря ответам ниже: ****

изменено

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

to 

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

и добавил следующее

urls.py

urlpatterns = [
   ...
]
if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) 
# when served with STATIC_URL and STATIC_ROOT instead it 
# is not working so check difference in MEDIA and STATIC.

В общем, мне не хватало (и все еще есть :)) базовых знаний о загрузке и отображении статических файлов.

Спасибо.

Answer 1

Когда вы создадите новую запись для таблицы Post, вам нужно загрузить файл изображения, поэтому, если вы установите URL-адрес мультимедиа, он будет храниться в указанном месте. Попробуйте установить MEDIA_ROOT и MEDIA_URL в файле settings.py Например.

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

Подробности можно посмотреть в документации django .

Answer 2

Судя по виду кода, вы пытались получить изображение из коллекции Post, а не из одной записи.

Попробуйте просто отобразить один из постов, если приведенный ниже синтаксис не работает, вы можете использовать цикл for для перебора всей коллекции.

<img src="{{ posts.first.title_picture.url }}"/>

Answer 3

Вы должны использовать models.ImageField() вместо models.FileField(). И должен установить пакет «Подушка» с пунктами.

Answer 4

settings.py:

'context_processors': [
                ...
                'django.template.context_processors.media',
                ...
            ],

шаблоны:

<img src="{{ MEDIA_URL }}{{title_picture.url}}"/>