HerokuでDjangoのCSSが読み込まれない。

Question

HerokuでDjangoのCSSが読み込まれません。

setting.py

import os
import django_heroku
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

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

ALLOWED_HOSTS = ['127.0.0.1', '.herokuapp.com']


INSTALLED_APPS = [
    "django.contrib.admin",
    "django.contrib.auth",
    "django.contrib.contenttypes",
    "django.contrib.sessions",
    "django.contrib.messages",
    "django.contrib.staticfiles",
    "blog",
]

MIDDLEWARE = [
    "django.middleware.security.SecurityMiddleware",
    'whitenoise.middleware.WhiteNoiseMiddleware',
    "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 = "personal_portfolio.urls"

TEMPLATES = [
    {
        "BACKEND": "django.template.backends.django.DjangoTemplates",
        "DIRS": ["personal_portfolio/templates/"],
        "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 = "personal_portfolio.wsgi.application"

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


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/2.1/topics/i18n/

LANGUAGE_CODE = "en-us"

TIME_ZONE = "UTC"

USE_I18N = True

USE_L10N = True

USE_TZ = True


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

DEBUG = False

try:
    from .local_settings import *
except ImportError:
    pass

if not DEBUG:
    SECRET_KEY = os.environ['SECRET_KEY'] # 追加
    import django_heroku
    django_heroku.settings(locals())

wsgi.py

import os

from django.core.wsgi import get_wsgi_application

os.environ.setdefault("DJANGO_SETTINGS_MODULE", "personal_portfolio.settings")

application = get_wsgi_application()

ファイル構成

Project
|-blog----pycache
|      |--migrations
|      |--static --- css -- index
|      |                 |_ bootstrap.min
|      |--templates
|      |-- init, admin, app, models, tests, urls, views
|-env
|-media
|-personal_portfolio -- templates - base.html
|                    |- init
|                    |- local_settings
|                    |- settings
|                    |- urls
|                    |- wsgi
|
|
|-staticfiles
|-gitignore
|-db.sqlite3
|-manage.py
|-Procfile
|-requirements
|-runtime

試したこと

1. staticfilesとProject直下にstaticファイルを置く

2.　wsgiファイルに下記を付け足す(このサイトを参考に)

from django.core.wsgi import get_wsgi_application
# この行を削除　from whitenoise.django import DjangoWhiteNoise 

application = get_wsgi_application()

->Errorが出る

at=error code=H10 desc="App crashed" method=GET path="/" host=leadersbooks.herokuapp.com request_id=f51b36c4-e73f-4395-9437-934cfc2d8d5e fwd="94.59.251.70" dyno= connect= service= status=503 bytes= protocol=https
2020-06-14T16:57:14.472697+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=GET path="/" host=leadersbooks.herokuapp.com request_id=70ff4a61-9b35-4e8c-80db-3fd82b9f327a fwd="94.59.251.70" dyno= connect= service= status=503 bytes= protocol=https

3.下記サイトを参考に修正
https://teratail.com/questions/114106

https://bebee5.com/%E3%80%90heroku%E3%80%91django%E3%81%AEcss%E5%8F%8D%E6%98%A0/

--> error??

Running python manage.py collectstatic --noinput on ⬢ leadersbooks... up, run.7306 (Free)
Found another file with the destination path 'css/index.css'. It will be ignored since only the first encountered file is collected. If this is not what you want, make sure every static file has a unique path.
Found another file with the destination path 'css/bootstrap.min.css'. It will be ignored since only the first encountered file is collected. If this is not what you want, make sure every static file has a unique path.

https://blog.a1yama.com/entry/2018/07/17/115055

しかしどれもうまくいきませんでした。
local環境(python manage.py runserver)ではcssは機能しています。
どなたかおわかりの方ご教示お願い致します。

Answer 1

こちらの手違いでcssがlocal環境でうまく保存できていませんでした。
cssが保存できていないのに、manage.py runserverではサイトが何故か見れたため、てっきりcssが保存されたのかと思っていました。

もし今後同じ問題がある方はぜひ参考にしてください。
ちなみに、

from django.core.wsgi import get_wsgi_application
# この行を削除　from whitenoise.django import DjangoWhiteNoise 

application = get_wsgi_application()

は機能しているようです