如何在django中显示mp3播放器

时间:2018-01-21 14:56:03

标签: python django

我有一个问题。我想在我的网站上有一个MP3播放器。我这样做了一些想法:

models.py

class Wpisy(models.Model):
    title = models.CharField(max_length=400, verbose_name="Tytuł")
    slug = models.SlugField(unique=True, max_length=400,verbose_name="Przyjazny adres url")
    content = models.TextField()
    status_audio = models.BooleanField(default=False, verbose_name="Czy dostępny będzie plik audio?")
    audio_file = models.FileField(upload_to='uploads/',verbose_name="Plik audio")
    created_date = models.DateTimeField(blank=True, null=True, verbose_name="Data utworzenia")
    category = models.ForeignKey(Kategorie, verbose_name="Kategoria", on_delete=models.CASCADE)

我在html文件中也有代码:

{% extends 'bajki/index.html' %}

{% block content %}
Utworzono : {{detale_bajki.created_date}}<br>
Kategoria: {{detale_bajki.category}}<br>
 {{ detale_bajki.title }}<br>
 {{ detale_bajki.content}}<br><p>
 {% if detale_bajki.status_audio == True %}
 <audio controls>
    <source src="/uploads/{{ audio_file.url }}" type="audio/mp3">
    Twoja przeglądarka nie obsługuje plików audio.
 </audio>
 {% else %}

 {% endif %}
{% endblock %}

html中的mp3播放器在页面上可见,但什么都不玩。在管理模式中,我在少数记录中添加了一首mp3歌曲,但仍然没有。我也是在settings.py行中​​创建的:

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

1 个答案:

答案 0 :(得分:0)

页面来源是:

<!DOCTYPE html>
<html>
<head>
    <title>Portal z bajkami</title>
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="/static/css/bajki.css">
</head>
<body>
<a href="/bajki/">Strona główna</a> |
<a href="/kontakt/">Kontakt</a> |<br>
</body>
</html>



<br>

Utworzono : 20 stycznia 2018 13:18<br>
Kategoria: Bajki do czytania<br>
 Nieposłuszna owieczka<br>
 na pewnej farmie....<br><p>

 <audio controls>
    <source src="/uploads/How_it_Began.mp3" type="audio/mp3">
    Twoja przeglądarka nie obsługuje plików audio.
 </audio>