How to deploy media files in django-heroku?

Question

I am trying to deploy a django app on heroku. I'm currently using the package django-heroku as the standard setup. Under my models some media files that are uploaded using ImageField and I want them to be displayed in my templates. However, although they seem to point to the correct destination they are not being served.

I've looked to similar questions here in SO and looked into the official package git repository looking for examples, however I did not find any example using the same configuration.

settings.py

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static")
] 

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

.
.
.

django_heroku.settings(locals())

template

{% extends 'base_site.html' %}
{% load i18n %}
{% block content_title %}{% trans 'Manage Product Detail' %}{% endblock%}
{% block content %}

<div class="card">  
  <div class="carousel-inner" role="listbox">
    {% for figure in product.figures.all %}        
        <div class="item{% if forloop.first %} active{% endif %}">                    
              <img src="{{ figure.image.url }}">
        </div>
    {%endfor%}
  </div>
  <div class="card-body">
    <h5 class="card-title">{{ product.name }}</h5>
    <p class="card-text">{{ product.description }}}
  </div>
  <div class="card-footer">
    <h5 class="card-title">{{ product.name }}</h5>
    <p class="card-text">{{ product.description }}}
  </div>
</div>


{% endblock %}

Although I can confirm that the media folder, subfolder and image exist (at the root of my project) and that the object is present in the template, I'm still presented with the following 404 error:

Not Found: /media/images/Screenshot_from_2018-12-26_21-07-01.png
[04/Jan/2019 14:32:34] "GET /media/images/Screenshot_from_2018-12-26_21-07-01.png HTTP/1.1" 404 2863

Answer 1

The package django-heroku would not provide this functionality out-of-the-box (due to restrictions on heroku side it is impossible to achieve seamless deployment and development of media files). In development one must load the media files through:

urlpatterns = [
    ....
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

In production the static files, as some users referred above must be served from an external source. Here are the tips I'm currently following: https://web.archive.org/web/20170607080235/http://djangobook.com/serving-files-production/