Как включить файлы изображений в шаблоны Django?

Я новичок в Django и пытаюсь изучить его с помощью простого проекта, который я разрабатываю, под названием «dubliners» и приложения под названием «book». Структура каталогов такая:

dubliners/book/  [includes models.py, views.py, etc.]
dubliners/templates/book/

У меня есть файл JPG, который нужно отображать в заголовке каждой веб-страницы. Где мне хранить файл? Какой путь я должен использовать для тега, чтобы отображать его с помощью шаблона? Я пробовал разные места и пути, но пока ничего не работает.

...

Спасибо за ответ, опубликованный ниже. Однако я пробовал использовать как относительные, так и абсолютные пути к изображению, и на веб-странице по-прежнему отображается значок сломанного изображения. Например, если у меня есть изображение в моем домашнем каталоге и я использую этот тег в моем шаблоне:

<img src="/home/tony/london.jpg" />

Изображение не отображается. Однако, если я сохраню веб-страницу как статический файл HTML, изображения отображаются, поэтому путь правильный. Может быть, веб-сервер по умолчанию, поставляемый с Django, будет отображать изображения только в том случае, если они находятся на определенном пути?


python django django-templates
person Tony    schedule 23.05.2009    source источник

Ответы (12)


arrow_upward
45
arrow_downward

В производственной среде у вас просто будет HTML-код, сгенерированный из вашего шаблона, указывающий, где на хосте хранятся медиафайлы. Так что в вашем шаблоне будет, например,

<img src="../media/foo.png">

И тогда вы просто убедитесь, что там есть каталог с соответствующими файлами.

во время разработки - другой вопрос. Документы django объясняют это лаконично и достаточно ясно, что более эффективно связать там и ввести здесь, но в основном вы определяете представление для носителя сайта с жестко заданным путем к месту на диске.

Справа здесь.

person JosefAssad    schedule 23.05.2009
comment
Наверное, лучше использовать ‹img src = {{MEDIA_URL}} foo.png /›, чем жестко указывать местоположение вашего мультимедиа. - person randlet; 23.05.2009
comment
Игнорируйте предыдущее, теперь я понимаю - я прочитал страницу об обслуживании статических файлов, на которые вы ссылались. - person Tony; 23.05.2009
comment
почему бы просто не использовать нас ‹img src = {{book.image.url}}› где книга - это имя объекта. Таким образом, вам не нужно знать имя файла и добавлять {{MEDIA_URL}}. - person SudoKid; 05.02.2016

arrow_upward
72
arrow_downward

Попробуй это,

settings.py

# typically, os.path.join(os.path.dirname(__file__), 'media')
MEDIA_ROOT = '<your_path>/media'
MEDIA_URL = '/media/'

urls.py

urlpatterns = patterns('',
               (r'^media/(?P<path>.*)$', 'django.views.static.serve',
                 {'document_root': settings.MEDIA_ROOT}),
              )

.html

<img src="{{ MEDIA_URL }}<sub-dir-under-media-if-any>/<image-name.ext>" />

Предостережение

Остерегаться! использование Context() даст вам пустое значение для {{MEDIA_URL}}. Вместо этого вы должны использовать RequestContext().

Я надеюсь, это поможет.

person Community    schedule 05.08.2009
comment
Большое спасибо за это! Наконец-то единственный ответ, который мне действительно помог! - person Jacques Bosch; 19.06.2010
comment
Что такое {'document_root': settings.MEDIA_ROOT}, это контекст, предоставленный вызываемой функции? - person AllTradesJack; 20.08.2014

arrow_upward
18
arrow_downward

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

В этом случае я не вижу ничего против того, чтобы хранить такой контент в STATIC.
И все становится очень просто:

статический

Для ссылки на статические файлы, сохраненные в STATIC_ROOT, Django поставляется со статическим тегом шаблона. Вы можете использовать это независимо от того, используете ли вы RequestContext или нет.

{% load static %} <img src="{% static "images/hi.jpg" %}" alt="Hi!" />

скопировано из официальной документации django 1.4 / встроенных тегов и фильтров шаблонов

person Andrey Belyak    schedule 10.09.2012

arrow_upward
12
arrow_downward

Я потратил два дня, работая над этим, поэтому просто подумал, что тоже поделюсь своим решением. По состоянию на 26/11/10 текущая ветка - 1.2.X, это означает, что вам необходимо иметь в settings.py следующее:

MEDIA_ROOT = "<path_to_files>" (i.e. /home/project/django/app/templates/static)
MEDIA_URL = "http://localhost:8000/static/"

* (помните, что MEDIA_ROOT - это место, где находятся файлы, а MEDIA_URL - константа, которую вы используете в своих шаблонах.) *

Затем в url.py поместите следующее:

import settings

# stuff

(r'^static/(?P<path>.*)$', 'django.views.static.serve',{'document_root': settings.MEDIA_ROOT}),

Затем в своем html вы можете использовать:

<img src="{{ MEDIA_URL }}foo.jpg">

Как работает django (насколько я понимаю:

  1. В html-файле он заменяет MEDIA_URL на путь MEDIA_URL, найденный в setting.py
  2. Он ищет в url.py любые совпадения для MEDIA_URL, а затем, если он находит совпадение (например, r '^ static / (? P.), $' * относится к http: / / localhost: 8000 / static /) он ищет файл в MEDIA_ROOT, а затем загружает его
person Robert    schedule 26.11.2010

arrow_upward
12
arrow_downward

В разработке
В папке приложения создайте папку с именем "static" и сохраните изображение в этой папке.
Для использования изображения используйте:

<html>
    <head>
       {% load staticfiles %} <!-- Prepare django to load static files -->
    </head>
    <body>
        <img src={% static "image.jpg" %}>
    </body>
</html>

В производстве:
Все так же, как и в разработке, просто добавьте еще пару параметров для Django:

  1. добавить в settings.py
    STATIC_ROOT = os.path.join(BASE_DIR, "static/") (это подготовит папку, в которой будут храниться статические файлы из всех приложений)

  2. убедитесь, что ваше приложение находится в INSTALLED_APPS = ['myapp',]

  3. в terminall выполните команду python manage.py collectstatic (это скопирует статические файлы из всех приложений, включенных в INSTALLED_APPS, в глобальную статическую папку - папку STATIC_ROOT)

    Это все, что нужно Django, после этого вам необходимо выполнить некоторые настройки на стороне веб-сервера, чтобы разрешить использование статической папки. Например. в apache2 в файле конфигурации httpd.conf (для Windows) или sites-enabled / 000-default.conf. (в части виртуального хоста сайта для Linux) добавьте:

    Псевдоним \ static "путь_к_вашему_проекту \ static"

    Требовать все предоставлено

    И все

person FirePower    schedule 14.03.2017
comment
Это неполный ответ. Чтобы использовать статические файлы в ваших шаблонах, необходимо правильно настроить параметры в файле settings.py. Прочтите документы - person Nrzonline; 14.03.2017
comment
По умолчанию в настройках используется статическая папка для импорта статических файлов (STATIC_URL = '/ static /') - person FirePower; 14.03.2017
comment
Начиная с Django 3 он должен быть {% load static %}. - person matheburg; 14.04.2020

arrow_upward
9
arrow_downward

Если ваш файл является полем модели внутри модели, вы также можете использовать ".url" в теге вашего шаблона, чтобы получить изображение.

Например.

Если это ваша модель:

class Foo(models.Model):
    foo = models.TextField()
    bar = models.FileField(upload_to="foo-pictures", blank = True)

Передайте модель в контексте ваших представлений.

return render (request, "whatever.html", {'foo':Foo.objects.get(pk = 1)})

В вашем шаблоне может быть:

<img src = "{{foo.bar.url}}">
person Pstrazzulla    schedule 08.09.2014

arrow_upward
9
arrow_downward

/ media каталог в корне проекта

Settings.py

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

urls.py

    urlpatterns += patterns('django.views.static',(r'^media/(?P<path>.*)','serve',{'document_root':settings.MEDIA_ROOT}), )

шаблон

<img src="{{MEDIA_URL}}/image.png" >
person Omar Giorgetti    schedule 23.05.2015

arrow_upward
5
arrow_downward

Ваш

<img src="/home/tony/london.jpg" />

будет работать для файла HTML, читаемого с диска, так как предполагается, что URL-адрес file:///home/.... Однако для файла, обслуживаемого с веб-сервера, URL-адрес будет выглядеть примерно так: http://www.yourdomain.com/home/tony/london.jpg, что может быть недопустимым URL-адресом, а не тем, что вы на самом деле имеете в виду.

Чтобы узнать, как обслуживать и где разместить статические файлы, ознакомьтесь с этим документом < / а>. В основном, если вы используете сервер разработки django, вы хотите показать ему место, где находятся ваши медиафайлы, а затем сделать так, чтобы ваш urls.py обслуживал эти файлы (например, используя некоторый префикс URL-адреса /static/).

Потребует, чтобы вы поместили что-то вроде этого в свой urls.py:

(r'^site_media/(?P<path>.*)$', 'django.views.static.serve',
    {'document_root': '/path/to/media'}),

В производственной среде вы хотите пропустить это и сделать так, чтобы ваш http-сервер (apache, lighttpd и т. Д.) Обслуживал статические файлы.

person kender    schedule 23.05.2009

arrow_upward
3
arrow_downward

Другой способ сделать это:

MEDIA_ROOT = '/home/USER/Projects/REPO/src/PROJECT/APP/static/media/'
MEDIA_URL = '/static/media/'

Это потребует от вас переместить папку мультимедиа в подкаталог статической папки.

Затем в своем шаблоне вы можете использовать:

<img class="scale-with-grid" src="{{object.photo.url}}"/>
person Stephen Tanner    schedule 22.06.2012

arrow_upward
2
arrow_downward

Я пробовал разные методы, но это не сработало, но это сработало. Надеюсь, это сработает и для вас. Файл / каталог должен находиться в следующих местах:

проект / ваше_приложение / шаблоны проект / ваше_приложение / статический

settings.py

import os    
PROJECT_DIR = os.path.realpath(os.path.dirname(_____file_____))
STATIC_ROOT = '/your_path/static/'

пример:

STATIC_ROOT = '/home/project_name/your_app/static/'    
STATIC_URL = '/static/'    
STATICFILES_DIRS =(     
PROJECT_DIR+'/static',    
##//don.t forget comma    
)
TEMPLATE_DIRS = (    
 PROJECT_DIR+'/templates/',    
)

проект / приложение / шаблоны / имя_файла.html

внутри тела

{% load staticfiles %}

//for image

img src="{% static "fb.png" %}" alt="image here"

//note that fb.png is at /home/project/app/static/fb.png

Если fb.png находился внутри /home/project/app/static/image/fb.png, тогда

img src="{% static "images/fb.png" %}" alt="image here"
person user2458167    schedule 11.06.2013

arrow_upward
0
arrow_downward

Если вы укажете адрес онлайн-изображения в своем проекте django, он будет работать. это работает для меня. Вы должны сделать снимок.

person john collin    schedule 29.07.2018

arrow_upward
0
arrow_downward

Также убедитесь, что проблема может быть не в пути, а в имени или расширении файла. При невозможности отображения изображения, добавленного в шаблон base.html, была обнаружена ошибка, связанная с расширением файла изображения. Если вы сохраняете изображение в формате jpeg, используйте .jpg в качестве расширения в теге img <img src="{% static 'logo.jpg' %}" alt="Logo">.

person user13934743    schedule 16.06.2021