Generating audio files in a Django project template

Question

I am attempting to create a pretty simple website using Django that will have a number of audio files stored in it and available for streaming and downloading. I know that there are other ways to do this, like using AWS, but I wanted to figure this way out first. I'll include my template here but wanted to note that it is currently messy because I have been experimenting with different structures to figure this problem out.

{% for song in concert.song_set.all %}
    <li>{{ song.song_title }}</li>
    <li>{{ song.song_location }}</li>
    <!-- Working -->
    <audio 
      class = "audioPlayer uniqueShowAP"
      controls <--controlsList="nodownload"
        src="{% static 'shows/audio/redRocks2019/01 Yi.mp3' %}">
        Your browser does not support the
        <code>audio</code> element.
    </audio>
    <!-- Not Working...yet -->
    <audio 
        class = "audioPlayer uniqueShowAP"
        controls <--controlsList="nodownload"
        src="/shows/static/shows/{{ song.song_location }}">
        Your browser does not support the
        <code>audio</code> element.
    </audio>

{% endfor %}

What I want to happen is for every concert that I save it will go through the songs saved under that concert and add them to under the name of the song. I have each song's relative location saved in the data base so that I should be able to just call upon it's location.

I've tested this out by calling {{ song.song_location }} which correctly displays each song's location.

I also tried using src="{% static 'shows/audio/redRocks2019/01 Yi.mp3' %}" just to make sure that the element is at least set up correctly and that works too.

How do I format the src="" in the element to point it to the correct audio files? I can include my views and models or whatever additional information you might need to help me figure this out. I've been at this for a while now and just need someone to point me in the right direction.

Answer 1

I think you should look into using a FileField. You can have a Song model, with a song_file = FileField(upload_to='song_files/') field. Then, the files can be saved and accessed more easily when looping through model instances:

<audio src='{{ song.song_file.url }}' controls></audio>

These files will be stored locally per your media settings. You can easily transition to using a storage solution like S3 for your media files, as you mentioned. It works incredibly smoothly with Django, so don't be scared.

Static files should be for things like css, js, and images that aren't going to change, like a favicon perhaps. I guess it could be used for a static song, hypothetically. But thinking about using static files this way above in conjunction with a model instance is a bit contrived and confusing, I think.