图像和声音(媒体)未在 django 上显示

Image and Sound (Media) not showing on django

我正在尝试在 Django 中播放音频,但找不到音频文件。我已经设置了 MEDIA_URL 和 MEDIA_ROOT 但它仍然不起作用。请帮我。 下面是代码片段

settings.py

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

urls.py

urlpatterns = [
    url(r'^admin/', include(admin.site.urls)),
    url(r'^$',home),
]

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

home.html

{% extends "layout/base.html" %}
{% block content %}
    <h1>  Sound Assessment Toolset  </h1>
    <audio src="{{MEDIA_URL}}master_sound/piano.mp3"></audio>
    <img src="{{ MEDIA_URL }}images/batman.jpg"/>
{% endblock %}

Image of Project Directory

日志文件:

Django version 1.8.7, using settings 'Sound_Assessment.settings'
Starting development server at http://127.0.0.1:8800/
Quit the server with CONTROL-C.
[17/Jun/2016 15:18:43] "GET / HTTP/1.1" 200 746
[17/Jun/2016 15:18:43] "GET /images/batman.jpg HTTP/1.1" 404 2321
[17/Jun/2016 15:18:43] "GET /master_sound/piano.mp3 HTTP/1.1" 404 2336
[17/Jun/2016 15:18:43] "GET /images/batman.jpg HTTP/1.1" 404 2321

您实际上并没有请求 MEDIA_URL 下的那些元素,正如您从日志文件中看到的那样。

那是因为您实际上并没有将这些变量传递给模板,所以它们被忽略了。

您需要在 settings.py 文件中添加媒体模板上下文处理器:

TEMPLATES = [
    {
        ...
        'OPTIONS': {
            'context_processors': [
                ...
                'django.template.context_processors.media',
            ],
        },
    },
]

那么您的模板中就会有 {{ MEDIA_URL }}

我从这个帖子中得到了答案 Django MEDIA_URL and MEDIA_ROOT

我所做的是在模板 Context_Processor 内的 settings.py 中添加这一行 "django.core.context_processors.media"。

这里

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'app/templates')]
        ,
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                 ...
                 'django.core.context_processors.media',
            ],
        },
    },
]