Django, uwsgi static files not being served even after collectstatic

Question

I'm having trouble with the deployment of a Django application on a Debian 8 VPS. Python version 2.7, Django 1.10.2.

My problem is that it will not serve static files in production mode (DEBUG = False) even after having run 'collectstatic' and assigning a STATIC_ROOT directory.

I've followed every instruction regarding this deployment (nginx, uwsgi, python) but still get 404's for all my static files. When collectstatic is run, it does put all the files into a /static/ directory at the top of the application. When I run uwsgi or the development server, the HTML and python functions fine, but all my static CSS,JS,IMG are not accessible.

When I switch back to DEBUG=True and run the dev server, my static files are present again.

Can someone have a look and see what I could be doing wrong? If you need any more context of files please let me know.

My settings.py reads as follows:

"""
Django settings for mysite project.

Generated by 'django-admin startproject' using Django 1.10.2.

For more information on this file, see
https://docs.djangoproject.com/en/1.10/topics/settings/

For the full list of settings and their values, see
https://docs.djangoproject.com/en/1.10/ref/settings/
"""

import os
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))


# Quick-start development settings - unsuitable for production
# See https://docs.djangoproject.com/en/1.10/howto/deployment/checklist/

# SECURITY WARNING: keep the secret key used in production secret!
SECRET_KEY = 'removedforstackoverflow'

# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = False

ALLOWED_HOSTS = ['removedforstackoverflow']


# Application definition

INSTALLED_APPS = [
    'main',
    'instant',
    'opengig',
    'widget_tweaks',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
]

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

ROOT_URLCONF = 'mysite.urls'

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                'django.template.context_processors.debug',
                'django.template.context_processors.request',
                'django.contrib.auth.context_processors.auth',
                'django.contrib.messages.context_processors.messages',
            ],
        },
    },
]

WSGI_APPLICATION = 'mysite.wsgi.application'


# Database
# https://docs.djangoproject.com/en/1.10/ref/settings/#databases

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}


# Password validation
# https://docs.djangoproject.com/en/1.10/ref/settings/#auth-password-validators

AUTH_PASSWORD_VALIDATORS = [
    {
        'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
    },
    {
        'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
    },
]


# Internationalization
# https://docs.djangoproject.com/en/1.10/topics/i18n/

LANGUAGE_CODE = 'en-us'

TIME_ZONE = 'UTC'

USE_I18N = True

USE_L10N = True

USE_TZ = True


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

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, "static/")

Here's the header.html file where I call my static files. If it was just bootstrap I'd use the CDN, but I have a few images that I use and i'd rather not set up a server just to host my static files when this application is so small.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Instant Backoffice</title>
    <meta charset="utf-8" />
    {% load staticfiles %}
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}" type = "text/css"/>
    <meta name="viewport" content = "width=device-width, initial-scale=1.0">
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript" src="{% static 'js/bootstrap.min.js' %}"></script>
<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="navbar-header">
                <a class="navbar-brand" href="/">
                    <img alt="Brand" src="{% static 'img/logo.svg' %}" height="25">
                </a>
            </div>
            <ul class="nav navbar-nav navbar-right">
                <ul class="nav nav-pills">
                    <li><a href="/instant/allorders">List of Orders</a></li>
                    <li><a href="/instant/payment">Change Payment Status</a></li>
                    <li><a href="/instant/review">Add a Review</a></li>
                    <li><a href="/instant/cancel">Cancel an Order</a></li>
                    <li><a href="/logout/">Logout</a></li>
                </ul>
            </li>
        </ul>
    </div>
</nav>
<div class="row">
    <div class='container-fluid'>
        <div class="col-sm-12">
            {% block content %}
            {% endblock %}
        </div>
    </div>
    </div>
</body>
</html>

Error list from the development server:

[06/Oct/2016 23:40:43] "GET /static/css/bootstrap.min.css HTTP/1.1" 404 102
[06/Oct/2016 23:40:43] "GET /static/js/bootstrap.min.js HTTP/1.1" 404 100
[06/Oct/2016 23:40:44] "GET /static/img/logo.svg HTTP/1.1" 404 93
[06/Oct/2016 23:40:44] "GET /static/js/bootstrap.min.js HTTP/1.1" 404 100
[06/Oct/2016 23:40:44] "GET /static/img/logo.svg HTTP/1.1" 404 93
[06/Oct/2016 23:40:44] "GET /static/img/bg.jpg HTTP/1.1" 404 91

As I said, I'm just getting 404's and I don't understand why. Any help would be great.

Answer 1

You need to make sure, urls.py file of your project is updated to serve the static file from production.

Update the urls.py file of your project with the following code as shown below.

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    # ... the rest of your URLconf goes here ...
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

Another thing, I don't see any STATICFILES_DIRS directories in your settings.py file as well. You need to update that too, so that when you run ./manage.py collectstatic command all the static assets from static dirs will get collected to your root static directory, that is the best practice in Django, even though directly putting the static files on STATIC_ROOT directory works for production.