Django 2.2 static / media files not showing / processing

Question

I'm trying to deploy my Django instructor's (Udemy) 'real estate' project. Here is Brad Traversy’s gist.

On my VPS I'm running Ubuntu 18.04, Python 3.6.8 and Django 2.2.4.

I've followed Brad’s guide for deploying Django. I kinda got it to run but the static files (CSS, JS and images) are not being served. It's an issue with my configuration and it is not clear to me what I'm doing wrong here or what exactly I am missing.

Here is what the end result should look like:

Here is what mine actually looks like:

Exploring other questions and answers on SO, inside my settings.py, I've tried swapping in (and out) different paths into STATIC_ROOT, MEDIA_ROOT, STATICFILES_DIRS using the join method. I’ve also tried adding a number of different list items into the urlpatterns variable inside urls.py. After trying each new potential change, I enter python manage.py collectstatic and then I run the server. Sometimes there would be a trace back preventing the server from running. In these situations, I just rolled back the change to a setting which was known to work or alternatively, I just tried something else entirely which would enable the server to run without a trace back.

As per @IrrupTor's answer, when running this project locally, the static and media files parse perfectly. So this confirms the issue exists in my remote configuration on my VPS. What other information could I provide to better clarify why static and media files are not loading on my VPS?

Here are some of the other questions on SO which I have used already:

• Django 2.2 Not Serving Static Files
• Static Files not being displayed in Production
• Django: Static Files not displayed on deployment server

Here is the output in my Django shell:

python manage.py runserver 0.0.0.0:8000
Performing system checks...

System check identified no issues (0 silenced).
September 14, 2019 - 00:44:11
Django version 2.2.4, using settings 'btre.settings'
Starting development server at http://0.0.0.0:8000/
Quit the server with CONTROL-C.
[14/Sep/2019 00:44:15] "GET / HTTP/1.1" 200 13775
[14/Sep/2019 00:44:15] "GET /static/css/bootstrap.css HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/css/all.css HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/css/style.css HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/css/lightbox.min.css HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/jquery-3.3.1.min.js HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/img/logo.png HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/lightbox.min.js HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/bootstrap.bundle.min.js HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/main.js HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/lightbox.min.js HTTP/1.1" 404 77
[14/Sep/2019 00:44:15] "GET /static/js/main.js HTTP/1.1" 404 77

Here is my urls.py:

from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('', include('pages.urls')),
    path('listings/', include('listings.urls')),
    path('accounts/', include('accounts.urls')),
    path('contacts/', include('contacts.urls')),
    path('admin/', admin.site.urls),

] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

Here are the relevant lines in my settings.py:

# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/2.1/howto/static-files/

STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), "static")

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

# Media Folder Settings
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'

Here is my file tree:

Here is my (forked) source code repo on GitHub.

One final note: Right now I am using Django's test server on my VPS. I realize this is not best practices because it is not secure. I am merely deploying with the Django's built in server as a stepping stone. Once the static and media files load I'll promptly switch to nginx and gunicorn, as described in the original guide.

Answer 1

I tried to reproduce your error:

It was working fine with settings.py configuration,

But as I added the static url configuration in urls.py then I also received 404 error.

I would suggest to modify to urls.py to following:

from django.contrib import admin
from django.urls import path, include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('', include('pages.urls')),
    path('listings/', include('listings.urls')),
    path('accounts/', include('accounts.urls')),
    path('contacts/', include('contacts.urls')),
    path('admin/', admin.site.urls),

]

Answer 2

I figured it all out.

At the bottom of settings.py in my original configuration, I attempted to import separate production settings with this:

try:
    from .local_settings import *
except ImportError:
    pass

Take note of the period before local_settings. This would refer to the hidden .local_settings.py file in the same directory. In my actual configuration, my production settings file was not actually hidden. My production settings just existed in the project directory as local_settings.py. There was actually no period prefixed. Given that my production settings were not referenced properly, this was my problem.

I really should have included the details of my production settings config file in my original question. I am not sure how I missed this.

My production DEBUG variable setting was set to False yet my Django live environment was still showing debug information in my web browser when I attempted to run my server. So this should have clued me in but I missed that last weekend when I first assembled this Stack Overflow question.

For now I got the server to run and parse static and media files properly but with changes in my original settings.py. So I’m still not calling local_settings.py properly. I’ll write a separate question about how to properly invoke production settings later.

Here are the temporary changes that I made to the primary settings.py which is working for me now:

1. ALLOWED_HOSTS includes my server’s IP address.
2. My DATABASES dictionary refers to the basic testing SQLite configuration instead of the more advanced PostgreSQL.
3. Instead of STATIC_ROOT set to os.path.join(BASE_DIR, 'static'), I have it set to os.path.join(os.path.dirname(BASE_DIR), "static")

I also changed the trailing urlpatterns static function call to include this: + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT). However whether I comment out or comment in that line, the server seems to continue to parse static and media files without issue.

Answer 3

no, .local_settings doesn't mean you need to have a '.local_settings.py' file.