Search code examples
pythondjangoapachewsgidjango-staticfiles

Django / Apache / Ubuntu Static files not being served

Everything was working fine until I moved from my local PC to a web server (AWS Ubuntu). I am using Apache with WSGI adapter.

DEBUG = FALSE so this is a live production environment.

I followed all the guides I could and have been at this for several days and still can't figure out why none of my images or styles are displaying.

I am having trouble wrapping my head around how static files work and there may be a simple reason why this isn't working but I can't figure it out. I have followed so many guides and am at a loss.

Yes I have run collectstatic, but all this seems to do is throw all my static files into the static folder. Not sure what the purpose of this is and I am having trouble understanding it on the django website.

You can view my site here: http://13.56.18.7/

The site loads without styles, If you check Chrome Dev tools, it shows none of my files being found:

enter image description here

Build:

enter image description here

urls.py

from django.contrib import admin
from django.urls import path
from app_main.views import (home_page, services_page, history_page, offers_page, contact_page)
from django.conf.urls import url
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    url(r'^$', home_page, name='home_page'),
    path('admin/', admin.site.urls),
    path('services/', services_page),
    url(r'^services/', services_page, name='services_page'),
    url(r'^history/', history_page, name='history_page'),
    url(r'^offers/', offers_page, name='offers_page'),
    url(r'^contact/', contact_page, name='contact_page'),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

settings.py

STATIC_DIR = os.path.join(BASE_DIR,"static")

STATIC_URL = '/static/'

if DEBUG:
    STATICFILES_DIRS = [os.path.join(BASE_DIR, 'static')]
else:
    STATIC_ROOT = os.path.join(BASE_DIR, 'static')

apache2.conf

WSGIDaemonProcess www-data processes=2 threads=12 python-path=/build/DoneRitePlumbing
WSGIProcessGroup www-data
WSGIRestrictEmbedded On
WSGILazyInitialization On
WSGIScriptAlias / /build/DoneRitePlumbing/DoneRitePlumbing/wsgi.py

<Directory /build/DoneRitePlumbing/DoneRitePlumbing>
    Require all granted
</Directory>

Alias /media/ /build/DoneRitePlumbing/media/
Alias /static/ /build/DoneRitePlumbing/static/


<Directory /build/DoneRitePlumbing/static>
Require all granted
</Directory>

<Directory /build/DoneRitePlumbing/media>
Require all granted
</Directory>

In the head of my base.html:

{% load static %}
<link rel='stylesheet' type="text/css" href="{% static 'css/styles.css' %}">

Home.html


{% extends "base.html" %}
{% load static %}
{% block contentHome %}

<style>
  .parallax {
    /* The image used */
    background-image: url("{% static 'images/FrontMain-2.png' %}");
    /* Set a specific height */
    height: 300px;
  }
</style>

base.html

{% load static %}
<!doctype html>
<html lang="en">

<head>
  <link rel='stylesheet' type="text/css" href="{% static 'styles.css' %}">
</head>

<body>

    {% include 'navbar.html' %}


      {% block contentContact %}
      {% endblock %}

      {% block contentServices %}
      {% endblock %}

      {% block contentHome %}
      {% endblock %}

      {% block contentOffers %}
      {% endblock %}

      {% block contentHistory %}
      {% endblock %}
Solution

  • After seeing your website and the error in the console, I think, changing

    STATIC_URL="/static/"

    to

    STATIC_URL="http://13.56.18.7/static/"

    in settings.py in your production should solve your problem. The {% static 'css/styles.css' %} you are using in the template should set href to /static/css/styles.css but instead it's setting it to /build/DoneRitePlumbing/static/css/styles.css. I cannot tell why this is happening from the provided information. Can you update the question with a complete template which is being loaded on the homepage?