У меня возникла проблема с загрузкой изображения с помощью Django

В настоящее время я работаю над проектом django, и у меня возникли проблемы с работой с MEDIA и загрузкой изображения графика.

Внутри settings.py я добавил приведенный ниже код.

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

Домашняя страница.html:

<img src = "{{ MEDIA_URL }}image.png" alt = "Uploaded Image" style = "max-width: 100%; height:     auto;">  

Домашняя страница->urls.py

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Относительный путь от html-файла к изображению: media/graph/upload/image.png

Я получаю ошибку

Not Found: /graph/upload/image.png.

Основной проект

--App
----settings.py 
--HomePage 
----HomePage.html 
----urls.py
--media 
----graph 
------upload 
--------image.png

Спасибо за все что ты сделал для меня! Дайте мне знать, если вам понадобится еще код, я просто не хотел делать это слишком долго, если это простая ошибка.

Я также пробовал жестко запрограммировать путь к каталогу, но это тоже не сработало, поэтому я думаю, что что-то не понимаю с Django.

Какой окончательный URL-адрес отображается в img src? Вы сами устанавливаете переменную шаблона MEDIA_URL или используете встроенный медиа контекстный процессор django?

CoffeeBasedLifeform 05.07.2024 10:32

@CoffeeBasedLifeform эй, я не устанавливаю Media_URL сам. Нужно ли мне это где-то делать? В конечном итоге я буду передавать имя файла следующим образом <img src = "{{ MEDIA_URL }}{{ filename }}" alt = "Загруженное изображение" style = "max-width: 100%; height: auto;">

Lance Van Elzen 05.07.2024 19:16

Ответ Виктора Дуарте ниже описывает, как Django может добавить переменную MEDIA_URL в контекст шаблона, чтобы вы могли использовать ее в шаблоне. С вашими настройками {{ MEDIA_URL }}image.png создаст URL-адрес /media/image.png. Однако, учитывая структуру каталогов, вам, вероятно, понадобится {{ MEDIA_URL}}graph/upload/image.png.

CoffeeBasedLifeform 05.07.2024 21:41

@CoffeeBasedLifeform огромное спасибо, у вас с Виктором все заработало!

Lance Van Elzen 05.07.2024 23:49
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
1
4
55
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

если вы хотите использовать {{ MEDIA_URL }} в своих шаблонах, добавьте django.template.context_processors.media в опцию context_processorsTEMPLATES.

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        "APP_DIRS": True,
        "OPTIONS": {
            "context_processors": [
                "django.template.context_processors.media"
            ],
        },
    },
]

Это сработало! Спасибо!

Lance Van Elzen 05.07.2024 23:49

Другие вопросы по теме