Статические файлы Django не работают на localhost

У меня есть приложение Django, запущенное на сервере разработки. HTML шаблоны работают нормально, но у меня большие проблемы со статическими файлами. Я перепробовал множество идей из Stack Overflow, но ничего не получается.

Я просто получаю ошибку 404 на изображении.

Может ли кто-нибудь помочь мне, пожалуйста?

Мой urls.py имеет следующий вид:

from django.contrib import admin
from django.urls import path
from app import views
from django.contrib.auth import views as auth_views
from django.conf.urls.static import static
from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
# The rest of my urls here...

urlpatterns = [
    path('', views.index, name='index'),
    path('admin/', admin.site.urls),
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

мои настройки включали в себя:

STATIC_ROOT = "/home/me/django-test/djangoproject/static"
STATIC_URL = 'static/'

и мой шаблон имеет:

<!doctype html>
{% load static %}
<img src="{% static 'e.png'%}">

Это сработало для меня в django 3.2. Для локальной статики вы должны создать папку под названием "static" в вашей папке config config - это папка, созданная при запуске проекта (возможно, вы называете ее mysite или что-то в этом роде):

django-admin startproject config

создайте папку "static" в той же папке, где находится файл settings.py

#In settings.py:

STATIC_URL = '/static/'

# folder for static when you deploy your project on server(not for local develop)
STATIC_ROOT =  os.path.join(BASE_DIR, 'static')

# local (in config for runserver)
STATICFILES_DIRS = [
   os.path.join(BASE_DIR, "config/static"),
]

Внутри папки "static" разместите папки css, js, img e.t.c

В наших шаблонах вы должны сделать что-то вроде этого:

<!DOCTYPE html>
{% load static %}
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{% static 'css_custom/base_style.css' %}"/>


    <title>{% block title %}TITLE{% endblock title %}</title>
    
</head>

Обратите внимание на мой тег шаблона

href="{% static 'css_custom/base_style.css' %}"

это означает, что я загружаю статические данные из:

config/static/css_custom/base_style.css

То же самое для загрузки изображения, в вашем template.html:

{% extends '_base.html' %}
{% load static %}
{% block content %}
<img src="{% static 'images/Bg.jpg' %}" alt="">
{% endblock content %}

что означает статическое от:

config/static/images/Bg.jpg

или вы можете добавить относительный путь в ваш style.css для некоторых классов, например:

  .header-home {
    height: 40vh;
    background-image: url("../images/Bg.jpg");
    background-size: cover;
    background-position: center;
    text-align: center;
  }

Надеюсь, это поможет вам

Вернуться на верх