Djangoにおける静的ファイル管理: 包括的なガイド

チュートリアル
Django Python

このチュートリアルでは、Djangoにおける静的ファイルとは何か、それらを効率的に管理する利点、ウェブアプリケーションにおけるそれらの目的、そしてさまざまな方法やツールを使用して静的ファイルを管理および提供する方法を説明するデモプロジェクトを設定する方法を見ていきます。

Table of Contents

Djangoは、高レベルのPython Web開発フレームワークで、Web開発者に迅速かつ効率的にWebアプリケーションを作成するための強力なツールキットを提供します。

DjangoはWebアプリケーションを迅速かつ効率的に作成するのに優れていますが、開発するWebアプリケーションのデザインとフィールを大切にすることもまた同等に重要です。そのためには、アプリケーションのデザインとフィールを支える資産を管理する方法を学ぶ必要があります。

Djangoの静的ファイル

Djangoでは、静的ファイルはサーバーで何ら処理されずにクライアントに直接提供されるファイルです。

これらは通常、CSS、JavaScriptファイル、画像、アイコン、フォント、その他のWebアプリケーションのデザインとフィールに必要な資産を含みます。

Djangoは、これらの静的ファイルを効率的に管理し、提供する仕組みを提供しており、スムーズなユーザーエクスペリエンスを保証します。

静的ファイルを効率的に管理する

Webアプリケーションのユーザーに良好なユーザーエクスペリエンスを提供し、アプリケーションが期待通りに機能するためには、静的ファイルを効率的に管理する必要があります。

静的ファイルを適切に整理し、キャッシュすることで、ページの読み込み時間が速くなり、応答性が向上し、全体的なユーザー満足度が高まります。

Djangoは、静的ファイルの処理を支援するためのさまざまなツールや規約を提供しています。

Webアプリケーションにおける静的ファイルの目的

静的ファイルは非常に重要であり、Webアプリケーションの外観とフィールを定義します。これらは、アプリケーション内のコンポーネントのスタイルがどのように設定されるか、ユーザーインタラクションに対する反応がどのように行われるかを定義し、最終的にユーザーが特定のWebアプリケーションを訪れたときに何を見るかを決定します。

静的ファイルを効率的に提供することで、視覚的に魅力的で応答性のあるユーザーインターフェースを作成でき、アプリケーションがより魅力的でユーザーフレンドリーになります。

デモプロジェクトの設定

Djangoでの静的ファイル管理の概念を説明するため、スクラッチからデモプロジェクトを設定します。

このプロジェクトでは、Djangoプロジェクトの作成、静的ファイル設定の構成、およびシンプルなWebアプリケーションに静的ファイルを統合することを含みます。

デモプロジェクトに従って、Djangoでの静的ファイル管理の実践的な経験を得ることができ、Web開発におけるそれらの重要性を理解できます。

このチュートリアルでは、ユーザーがプロジェクトのホームページを訪れると、サイトへの歓迎を表すスタイリッシュな見出しが表示されるランディングページを作成します。また、JavaScriptを使用して今日の日付を表示し、ページを完成させるために画像も提供します。

プロジェクトを保持するディレクトリの作成

次のコマンドを使用して、デモプロジェクトを保持するディレクトリを作成することから始めましょう。

mkdir sitepoint_django_static_tut

仮想環境の作成

新しいプロジェクトを仮想環境内で隔離することをお勧めします。これにより、各プロジェクトは独自の依存関係を持ち、グローバルなPythonインストールに影響を与えません。

仮想環境を作成するためにvirtualenvパッケージを使用します。開発環境にインストールされていない場合は、pip install virtualenvを使用してインストールし、以下のコマンドを使用して仮想環境を作成してください:

virtualenv myenv

上記のコマンドはmyenvという名前の仮想環境を作成します。仮想環境を使用するには、アクティブ化する必要があります:

Linux/macOS:

. myenv/bin/activate

Windows:

. myenv\Scripts\activate

依存関係のインストール

仮想環境がアクティブになったら、プロジェクトの依存関係をインストールできます。最初に、Djangoをインストールします。他の依存関係は、それらの使用方法を示すセクションに到達したときにインストールします:

pip install Django

これにより、執筆時点での最新の安定版であるDjango 5.0がインストールされます。

Djangoプロジェクトの作成

Djangoのインストールが成功したら、Djangoの管理コマンドにアクセスできるようになります。仮想環境でDjangoプロジェクトを作成するためにそれらを使用しましょう:

django-admin startproject sitepoint_django .

上記のコマンドはsitepoint_djangoという名前のDjangoプロジェクトを作成し、最後のドットは、現在のディレクトリにプロジェクトを作成する意図を示します。

デモアプリの作成

静的ファイル管理のさまざまな概念を説明するために、プロジェクト内に少なくとも1つのDjangoアプリを作成する必要があります。

python manage.py startapp  static_demo

これにより、static_demoという名前の新しいアプリがプロジェクトに作成されます。このアプリがプロジェクトに認識されるためには、プロジェクトのsettings.pyファイル内のインストール済みアプリ設定に追加する必要があります。sitepoint_django/settings.pyを開き、INSTALLED_APPS設定に移動し、以下のようにリストの最後にstatic_demo.apps.StaticDemoConfigを追加してください：

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # その他のアプリ
    'static_demo.apps.StaticDemoConfig',
]

ホームページのテンプレートの作成

ユーザーがサイトのホームページを訪れると、HTMLをレンダリングします。static_demoアプリ内にtemplatesディレクトリを作成し、その中に別のディレクトリを作成してstatic_demoと名付けます。このディレクトリ内にテンプレートを作成し、index.htmlと名付けると、パスはstatic_demo/templates/static_demo/index.htmlになります。

index.htmlに以下のコードを配置してください：

<!-- static_demo/index.html -->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sitepoint Django Tutorial</title>
</head>
<body>
    <h2>Hello there, welcome to our great site!</h2>
</body>
</html>

インデックスビューの作成

ユーザーがアプリのホームページを訪れるたびに、home.htmlテンプレートが表示されるように、home.htmlテンプレートをレンダリングするためにトリガーされるビュー関数を作成する必要があります。static_demo/views.pyファイルを開き、以下のコードを入力してください：

# static_demo/views.py

from django.shortcuts import render

def index(request):
    return render(request, "static_demo/home.html")

static_demoのURLファイルの作成

サイトにユーザーがアクセスしたときに常にホームページをレンダリングするように、static_demoアプリのインデックスビューを希望しています。そのため、ホームページをレンダリングするビュー関数のためのURLスキームを作成する必要があります。そのために、static_demoアプリのためのurls.pyファイルを作成し、static_demoのURLファイルをプロジェクトのURLファイルに接続する必要があります。

それゆえ、static_demoアプリでファイルを作成し、urls.pyと名付け、以下のコードを追加してください：

# static_demo/urls.py

from django.urls import path
from .import views

app_name = 'static_demo'

urlpatterns = [
    path('', views.index, name="index"),
]

上記のコードは、プロジェクトのインデックスビューのためのURLを作成します。そのため、ユーザーがhttp://oursite.com/のようなものにアクセスするか、開発中にhttp://127.0.0.1:8000にアクセスすると、インデックスビューがその応答のために呼び出されます。

次に、プロジェクトのURLファイルに追加しましょう。sitepoint_django/urls.pyファイルを開き、以下のコードを追加してください：

# sitepoint_django/urls.py

from django.contrib import admin
from django.urls import path, include # includeへのインポートを追加

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', include('static_demo.urls')), # この行を追加
]

上記のコードは、既定のurls.pyファイルにいくつかの変更を加えています。include関数へのインポートを追加し、Djangoにstatic_demo.urlsを含めていることを伝えています。

プロジェクトのテスト

この時点でプロジェクトの初期設定が完了しています。すべてがうまくつながっているか確認するために、開発サーバーを実行してみましょう。

以下のコマンドでプロジェクトを実行してください：

python manage.py runserver

すべてが正しく設定されている場合、http://127.0.0.1:8000にアクセスできるはずです。サイトがあなたを歓迎するいくつかの未装飾のテキストが表示されます。

開発環境での静的ファイルの提供

ページにスタイリングを追加し、日付のためのJavaScript、そして画像を追加するために、プロジェクトに変更を加える必要があります。徐々に行い、開発環境でどのように異なる静的ファイルを異なる方法で提供できるかを見てみましょう。

静的ファイルディレクトリの設定

Djangoは、すべての静的資産がアプリケーションごとに管理されることを推奨しています。つまり、特定のアプリケーションが必要とするすべてのCSS、JS、および画像は、そのアプリケーションの範囲内に存在しなければなりません。それでは、static_demoアプリケーションを更新し、staticという名前のディレクトリを作成し、その中にstatic_demoという名前の別のディレクトリを作成しましょう。次に、static_demoディレクトリ内にさらに3つのディレクトリを作成します：css、js、およびimages。最後に、以下のような構造ができあがります。

static_demo/
    └── static/
        └── static_demo/
            ├── css/
            ├── js/
            └── images/

staticディレクトリ内にstatic_demoディレクトリを作成する理由は、静的資産の名前空間を作成するためです。複数のアプリケーションがあり、両方のアプリケーションにstyles.cssという名前のCSSがある場合、Djangoは最初に見つけたスタイルシートだけを使用し、他を区別できません。そのため、名前空間を作成して、Djangoがテンプレートでどの資産ファイルを参照しているかを知ることができるようにします。

静的ファイルの作成

このステップでは、開発中にファイルを提供する方法を示すための最小限の静的アセットを設定しましょう。

まず、js ディレクトリにファイルを作成し、todays_date.js という名前を付け、以下のコードを追加してください：

/* static_demo/js/todays_date.js */

let formattedDate = new Date().toLocaleDateString();

document.getElementById('todaysDate').innerText = `The date today is ${formattedDate}`;

上記のコードは、JavaScriptから今日の日付を取得し、文字列にフォーマットして、todaysDateというIDを持つdivに表示します。

次に、css ディレクトリにstyles.cssという名前のファイルを作成し、以下のコードを追加してください：

/* static_demo/css/styles.css */

body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0;
}

h2 {
    font-size: 24px; 
    color: green;
}

上記のコードは、Flexboxレイアウトを使用して、ページ上のすべてのアイテムを水平および垂直に中央揃えにし、H2要素のフォントサイズを24pxに、色を緑に設定します。

画像については、好きな画像を使用できます。images ディレクトリに画像をコピーし、その名前を覚えておいてください。

静的ファイル設定の構成

開発中に静的ファイルを提供するためには、Djangoのsettings.pyファイルでいくつかの設定を行う必要があります。sitepoint_django/settings.pyファイルを開き、以下の設定があるか確認してください：

# sitepoint_django/settings.py

DEBUG=True

開発時には、Djangoプロジェクトの設定でDEBUGをTrueに設定することが一般的に推奨されます。この設定により、詳細なエラーメッセージやスタックトレースなど、開発中の問題診断や修正に不可欠な様々なデバッグ機能が有効になります。

さらに、DEBUGがTrueに設定されている場合、django.contrib.staticfilesアプリケーションは各アプリのstaticディレクトリから静的ファイルを自動的に提供します。この動作により、静的ファイルの提供に関する手動設定を行う必要がなくなり、開発プロセスが簡素化されます。

INSTALLED_APPS設定で、django.contrib.staticfilesが追加されているか確認してください。追加されていない場合は、プロジェクト内のアプリケーションの上に追加してください。例えば、このプロジェクトではstatic_demoアプリケーションの文字列より上に追加するようにしてください。以下のように表示されます。

# sitepoint_django/settings.py`

INSTALLED_APPS = [

    'django.contrib.staticfiles',
    'static_demo.apps.StaticDemoConfig',
]

Djangoが提供するdjango.contrib.staticfilesアプリケーションは、開発中に静的ファイルを提供するために不可欠です。デフォルトでは、各アプリ内の静的ファイルディレクトリを検索するためにプロジェクトのアプリケーションをトラバースします。ただし、特定のアプリに関連付けられていない追加の静的資産がある場合でも、プロジェクトのsettings.pyファイル内のSTATICFILES_DIRS設定を使用して、django.contrib.staticfilesにアクセスできるようにすることができます。この設定により、静的ファイルが存在する追加のディレクトリを指定できます。例:

# sitepoint_django/settings.py`

STATICFILES_DIRS = [
    "/dir/with/staticfiles/static",
    "/someother/dir/static",
    "/home/example.com/static",
]

Django プロジェクトの設定ファイルに含めるべき重要な設定である DEBUG や STATICFILES_DIRS に加えて、STATIC_URL も含めることが重要です。Django は STATIC_URL にデフォルト値を提供していますが、既に存在していなければ settings.py ファイルで明示的に定義することができます。

STATIC_URL 設定は、静的アセットが提供される基本 URL を指定します。たとえば、STATIC_URL = "static/" と設定すると、Django は静的アセットを /static/ URL パスから提供するよう指示されます。これは、例えば、static_demo アプリにあるスタイルファイルが http://127.0.0.1:8000/static/static_demo/css/styles.css のような URL でアクセス可能になることを意味します。

テンプレートの更新

設定が終わったら、テンプレートで静的ファイルを使用するために、以下の HTML で更新する必要があります。


<!-- static_demo/index.html -->



<!-- 静的ファイル処理機能の追加 -->

{% load static %}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sitepoint Django Tutorial</title>

    
<!-- 以下に css へのリンクを追加 -->

    <link rel="stylesheet" href="{% static 'static_demo/css/styles.css'%}"> 
</head>
<body>
    <h2>Hello there, welcome to our great site</h2>
    <p id="todaysDate"></p>
    
<!-- 以下に画像へのリンクを追加 -->

    <img src="{% static 'static_demo/images/flowerImage.png' %}" alt="Flower Image"> 

    
<!-- 以下に js へのリンクを追加 -->

    <script src="{% static 'static_demo/js/todays_date.js' %}"></script>
</body>
</html>

このテンプレートの更新で新しいタグ {% load static %} に出会います。このタグは Django テンプレートエンジンが提供する静的ファイル処理機能をロードします。このタグを Django テンプレートファイルに含めることで、静的ファイルに関連するテンプレートタグやフィルターを使用できるようになります。

例えば、テンプレートでこれを使用することで、HTML要素内で画像、CSS、JSなどの静的ファイルを参照できるようになります。また、Djangoが参照する静的資産のURLを生成することも可能になります:

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

<img src="{% static 'static_demo/images/flowerImage.png' %}" alt="Flower Image"> 

<script src="{% static 'static_demo/js/todays_date.js' %}"></script>

上記の設定とテンプレートの更新が完了したら、プロジェクトを実行して、開発環境でファイルが提供されているか確認する必要があります。以下のコマンドでプロジェクトを実行します:

python manage.py runserver

設定が正しければ、開発サーバーがhttp://127.0.0.1:8000で実行されているはずです。そのリンクにアクセスすると、以下のようなページが表示されるはずです。

類似の画像が表示されることで、静的ファイルが正しく適用されたことが確認できます。

Django開発時には、プロジェクトの設定でDEBUG=Trueであり、django.contrib.staticfilesが有効になっている場合、これによりDjangoの開発サーバー(runserver)が静的ファイルを提供できるようになります。この状況では、CSS、JavaScript、画像などの静的ファイルに加えた変更が自動的に検出され、Djangoによって適用されます。このスムーズなプロセスにより、手動でサーバーをリフレッシュしたり再起動したりすることなく、変更の効果をすぐに確認できるため、開発が大幅に簡素化されます。

しかし、実稼働環境では、静的ファイルの提供は通常、別のWebサーバーやCDNを使用することが含まれます。この場合、静的ファイルへの変更はDjangoによって自動的に検出され、適用されることがなく、更新されたファイルがユーザーに提供されることを確認するために手動の介入が必要になる場合があります。さらに、django.views.static.serve()ビューなどの別の方法で静的ファイルを手動で提供する場合、変更の自動検出や適用は行われず、静的ファイルの更新を処理する独自のメカニズムを実装する必要があるかもしれません。

WhiteNoiseを使用した静的ファイルの提供

開発中は、django.contrib.staticfilesが静的資産の提供プロセスを簡素化し、変更を加えることでシームレスな更新を保証します。

しかし、実稼働環境に移行する際には、DEBUG=Trueのような設定を無効にする必要があり、静的ファイルはCDNや別のサーバーから提供される可能性があります。これには、開発中にファイルのスムーズな提供を可能にし、同時に実稼働環境を正確に反映するソリューションが必要です。

WhiteNoiseパッケージが登場します。Djangoとシームレスに統合するように設計されたWhiteNoiseは、開発環境および実稼働環境の両方で静的ファイルを提供するための強力なソリューションを提供し、展開段階全体で一貫性と信頼性を保証する包括的なアプローチを提供します。WhiteNoiseを探ってみましょう。

DjangoでのWhiteNoiseのインストールと設定

WhiteNoiseを始めるのは簡単です。このセクションでは、インストールプロセスを説明し、Djangoプロジェクト内でWhiteNoiseを設定する方法をご案内します。

ホワイトノイズを以下のようにインストールします:

pip install whitenoise

インストールが成功したら、sitepoint_django/settings.pyに移動し、下部にスクロールして、STATIC_URL設定を見つけます。その下に、STATIC_ROOT設定を追加します:

# sitepoint_django/settings.py

STATIC_ROOT = BASEDIR / "staticfiles"

上記の設定は、collectstaticが実行されると、プロジェクト内のすべてのアプリの静的アセットがこのstaticfilesという名前のディレクトリに収集されて格納されることをDjangoに伝えます。

次に行うべきことは、collectstatic管理コマンドを実行することです:

python manage.py collectstatic

ホワイトノイズを有効にするには、MIDDLEWARE設定リストに追加する必要があります。settings.pyファイルを編集し、DjangoのSecurityMiddlewareの後、他のすべてのミドルウェアの前にホワイトノイズミドルウェアを追加します:

# sitepoint_django/settings.py

MIDDLEWARE = [
    # ...
    "django.middleware.security.SecurityMiddleware",
    "whitenoise.middleware.WhiteNoiseMiddleware",
    # ...
]

開発でのホワイトノイズの使用

上記の手順だけで、ホワイトノイズは本番環境で静的ファイルを提供できます。しかし、この時点でプロジェクトを実行すると、Djangoの開発サーバーが静的ファイルの処理を自動的に引き継ぐでしょう。しかし、開発と本番で同様の動作を享受するために、開発でもファイルを提供するようにするのは良いアイデアです。

そのために、Djangoの静的ファイル処理を無効にし、設定ファイルを編集してWhiteNoiseをINSTALLED_APPSリストに追加することで、WhiteNoiseに処理を引き継ぐようにします。django.contrib.staticfilesより上に設定します:

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # ...
    "whitenoise.runserver_nostatic",
    "django.contrib.staticfiles",
    # ...
]

また、DEBUGをFalseに設定して無効にする必要があります:

# sitepoint_django/settings.py

DEBUG=False

これらの手順に従えば、WhiteNoiseパッケージを使用して静的資産をスムーズに提供できます。

WhiteNoiseがファイルを提供していることを確認するために、INSTALLED_APPS設定リストからdjango.contrib.staticfilesオプションを削除またはコメントアウトできます。ただし、django.contrib.staticfilesを削除すると、collectstaticコマンドなどのいくつかの静的ファイル管理コマンドが使用できなくなることに注意してください。このコマンドは、アプリケーションからの静的ファイルを単一のディレクトリに収集・統合し、プロダクション環境での効率的な提供に不可欠です。

高度なWhiteNoise設定オプション

上記のステップはほとんどのケースで十分ですが、WhiteNoiseは構成のためのいくつかの追加オプションも提供しています。例えば、プロジェクトに圧縮とキャッシングサポートを追加できます。それを有効にするには、sitepoint_django/settings.pyファイルを開き、次の設定を追加してください:

# sitepoint_django/settings.py

STORAGES = {
    # ...
    "staticfiles": {
        "BACKEND": "whitenoise.storage.CompressedManifestStaticFilesStorage",
    },
}

上記の設定は、WhiteNoiseが静的ファイルを圧縮し、ユニークな名前にハッシュ化することを保証します。そのため、安全にキャッシュされます。

共有ホスティング環境でのWhiteNoiseの使用

共有ホスティングは、複数のウェブサイトが単一の物理サーバー上にホストされるウェブホスティングサービスの一種です。この構成では、ディスクスペース、帯域幅、処理能力などのリソースが複数のユーザー間で共有され、小規模から中規模のウェブサイトのホスティングに対してコスト効果の高いオプションとなっています。

共有ホスティング環境は通常、ホスティングプロバイダーによって管理され、サーバーの保守、セキュリティ、技術サポートを扱っており、ウェブサイトのオーナーはサーバーアドミンストレーションタスクについて心配することなく、ウェブサイトの構築と管理に集中できます。

共有ホスティングでの静的ファイル管理の課題

共有ホスティングは多くのウェブサイトにとって経済的で便利なホスティングソリューションを提供しますが、仮想プライベートサーバー（VPS）やディビデットサーバーなどの他のタイプのホスティングに比べて制限があります。これらの制限には以下が含まれます:

  • サーバーの設定や設定に対する制限は、サーバーソフトウェアのカスタマイズや追加ツールのインストール能力を制限します。

  • ディスクスペースなどのリソース制約も関係しており、訪れるユーザーにファイルを提供できる帯域幅の量に制限がある可能性があります。

  • 共有ホスティングでのパフォーマンスも課題であり、他のユーザーとリソースを共有することで、特にトラフィックやリソース利用の高い時期に静的ファイルの読み込み時間が遅くなる可能性があります。

WhiteNoiseを使用するための設定

WhiteNoiseはDjangoと無縫に統合されるPythonパッケージであり、共有ホスティング環境での静的ファイルの提供に最適な選択肢です。ApacheやNginxなどの他のソフトウェアのインストールが特定のホスティング環境で許可されていない場合でも、WhiteNoiseは他のプロジェクトパッケージと簡単にインストールできます。

Djangoを設定してWhiteNoiseを使用することで、追加のサーバーソフトウェアなしでDjangoアプリケーションから静的ファイルを効率的に提供できます。これにより、セットアッププロセスが簡略化され、幅広いホスティングプロバイダーとの互換性が確保されます。

ほとんどのシェアードホスティングプロバイダーは、サーバー構成やファイルアップロードができるcPanelを提供しています。ファイルをアップロードした後、プロジェクトのsettings.pyファイルに次の変更を加えることができます。

# sitepoint_django/settings.py

STATIC_URL='static/'

# cpanelのユーザー名を置き換えてください
# https://example.comのようなメインドメインで作業している場合はpublic_htmlを使用
STATIC_ROOT='/home/username/public_html/static'

# または
# https://subdomain.example.comのようなサブドメインで作業している場合はフォルダ名を使用
STATIC_ROOT='/home/username/subdomain.mydomain.com/static'

これらの設定が整ったら、collectstaticコマンドを実行するだけで、静的ファイルが上記のいずれかのSTATIC_ROOTディレクトリに集められるようになります。ドメインに応じて異なります。

AWS S3からの静的ファイルの提供

Amazon Simple Storage Service (S3)は、Amazon Web Services (AWS)が提供するスケーラブルなオブジェクトストレージサービスです。バケットと呼ばれるストレージスペースを作成し、ドキュメント、画像、動画などのさまざまな種類のデータを保存できます。チュートリアルで注目される静的ファイルも含まれます。

AWSは、Amazon S3を含むいくつかのサービスに対して無料プランを提供しています。無料プランは、ユーザーが一定期間または特定の使用量制限までAWSサービスを無料で始めることができるようにします。始めるには、S3無料プランにサインアップできます。ただし、サインアッププロセスを完了するには支払い情報を提供する必要があります。

S3バケットの作成

バケットを作成するには、S3ダッシュボードにアクセスしてバケットの作成ボタンをクリックします。

バケットに一意のDNS互換名を付けます。オプションで、あなたやユーザーに近いリージョンを選択することもできます。

バケットのACLを有効にします。

バケットへの公開アクセスを有効にするには、すべての公開アクセスをブロックをオフにします。

作成が成功すると、S3のメインページにバケットが表示されるはずです。

IAMアクセスの有効化

バケットの作成後、ルートユーザーとしてバケットを使用できますが、AWSは特定のバケットにのみアクセス権を持つIAM（Identity Access Management）ユーザーグループを作成することを推奨しています。

IAMグループの作成

IAMのメインページにアクセスし、サイドバーのユーザーグループを選択します。次に、グループの作成ボタンをクリックします。グループに名前を付けます。

次に、ポリシーのアタッチの下で、S3を検索し、AmazonS3FullAccessを割り当ててからグループの作成ボタンをクリックします。

IAMユーザーの作成

IAM ページにとどまり、左側のパネルでユーザーを選択し、ユーザーを作成ボタンをクリックします。

IAM ユーザーに名前を付けて次へボタンをクリックします。

権限の設定オプションで、ユーザーをグループに追加を選択されたままにし、ユーザーグループに移動して、上で作成したユーザーグループを選択し、次へボタンをクリックします。

確認してユーザーを作成をクリックします。

次に、ユーザー名をクリックしてユーザーの詳細を表示します。セキュリティ証明書タブをクリックし、アクセスキーを作成をクリックします。ローカルコードを選択し、次へボタンをクリックします。

その後、アクセスキーを作成ボタンをクリックします。キーを.envファイルにコピーできます（あれば）、または後で使用するためにCSVファイルをダウンロードできます。

Django を AWS S3 から静的ファイルを使用するように設定する

S3 バケットを作成した後、プロジェクトを S3 からファイルを提供するように設定する必要があります。前のセクションでは、WhiteNoise を使用して静的アセットを提供するように設定しました。S3 からアセットを提供できるようにするために、WhiteNoise を無効にする必要があります。そのために、sitepoint_django/settings.pyファイルに移動し、関連するコード行をコメントアウトします。

# sitepoint_django/settings.py

INSTALLED_APPS = [
    # ...
    # "whitenoise.runserver_nostatic",
    # ...
]

MIDDLEWARE = [
    # ...
    # "whitenoise.middleware.WhiteNoiseMiddleware",
    # ...
]

# STORAGES = {
#     "staticfiles": {
#         "BACKEND": "whitenoise.storage.CompressedManifestStaticFilesStorage",
#     },
# }

上記のコードは、WhiteNoiseに対して設定したすべての設定をコメントアウトしています。

パッケージのインストール

プロジェクトがS3で動作できるようにするために、boto3とdjango-storagesという2つのパッケージをインストールする必要があります。boto3はAWSサービスと対話するための低レベルのPython APIを提供し、django-storagesはDjangoのファイルストレージ機能を拡張してクラウドストレージプロバイダー（Amazon S3など）と統合し、Djangoアプリケーション内で静的ファイルとメディアファイルをシームレスに管理および提供できるようにします。

pip install boto3 django-storages

設定の構成

プロジェクトがS3からファイルを提供できるようにするために、settings.pyファイルをいくつか変更し、次のコードで更新する必要があります。

# sitepoint_django/settings.py
import os  # first add an import for the os module

# S3 storage setting
STORAGES = {
    'staticfiles': {
        'BACKEND': 'storages.backends.s3boto3.S3Boto3Storage',
        'OPTIONS': {
            'bucket_name': os.getenv('AWS_STORAGE_BUCKET_NAME'),
            'location': 'static',
            'querystring_auth': False,
        },
    }
}

上記の設定は、プロジェクト内で使用されるさまざまなストレージバックエンドを定義するための集中管理された設定コンテナとして機能するSTORAGESディクショナリを作成します。

この設定がDjangoの4.2以降のバージョンでのみ利用可能であることに注意してください。以前のバージョンの場合は、ドキュメントを参照してください。

上記のコードでは、静的ファイルを管理するためのストレージ構成を識別するstaticfilesの設定があります。

STORAGES設定の後、設定ファイルにAWS固有の設定を追加する必要があるため、STATIC_URL設定がある部分までスクロールして、以下の変更を行います。

# sitepoint_django/settings.py

USE_S3 = os.getenv('USE_S3')

if USE_S3:
    AWS_ACCESS_KEY_ID = os.getenv('AWS_ACCESS_KEY_ID')
    AWS_SECRET_ACCESS_KEY = os.getenv('AWS_SECRET_ACCESS_KEY')
    AWS_S3_OBJECT_PARAMETERS = {
        "CacheControl": "max-age=2592000",
    }

else:
    STATIC_URL = 'static/'
    STATIC_ROOT = BASE_DIR / 'staticfiles'

S3に静的ファイルをアップロード

設定が整ったら、次のタスクはS3バケットに静的ファイルをアップロードすることです。それを行うにはcollectstaticを実行します。

python manage.py collectstatic  --no-input

これにより、プロジェクトのアプリケーション内のすべての静的ファイルが収集され、S3バケットに移動され、STORAGESディクショナリで定義されたstaticフォルダに配置されます。--no-inputフラグは、Djangoが非対話モードで実行され、ユーザー入力のプロンプトをバイパスするように指示します。

Djangoを使用すると、ユーザーからの手動介入を必要とせず、静的ファイルのコレクションプロセスが自動的に進行します。

プロジェクトの実行

設定がすべて整ったら、プロジェクトを実行できます。開発環境でプロジェクトを実行し、S3バケットからファイルを提供しましょう：

python manage.py runserver

S3からファイルを提供していることを確認するために、ホームページのソースコードを表示できます：

<link rel="stylesheet" href="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/css/styles.css">

<img src="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/images/flowerImage.png" alt="Flower Image">

<script src="https://sitepoint-django-static.s3.amazonaws.com/static/static_demo/js/todays_date.js"></script>

HTML要素を見ることで、確かにURLがS3バケットを指していることがわかります。

結論

要約すると、Djangoでの静的ファイル管理は、プロジェクトの要件、スケーラビリティのニーズ、およびホスティング環境の制約を評価し、最も適切な方法を選択することを含みます。

例えば、WhiteNoiseミドルウェアは、リソース制約やサーバーへのアクセスが限られているシェアードホスティング環境での静的ファイル提供に効率的なソリューションを提供します。

Djangoの設定を適切に設定し、WhiteNoiseなどのツールを活用することで、開発者はホスティング環境に関係なく、信頼性の高い最適化された静的ファイル提供を保証できます。各方法には独自の利点と考慮事項があり、特定のプロジェクトのニーズに合わせて慎重に評価する必要があり、シームレスなユーザーエクスペリエンスを提供します。

いくつかの重要なポイントを説明しました：

静的ファイルの管理方法 様々なアプローチについて議論しました。これには、静的ファイルをローカルで提供する方法、Djangoの組み込み開発サーバーを使用する方法、Amazon S3のようなサードパーティのストレージソリューションを活用する方法、WhiteNoiseのようなパッケージを使用してファイルを提供する方法などが含まれます。各方法には、スケーラビリティ、パフォーマンス、展開の容易さなどの要因に応じて独自の利点と考慮事項があります。

一般的な設定とコマンド:

  • STATIC_ROOT: 収集された静的ファイルが保存されるディレクトリを指定します。
  • STATIC_URL: ウェブサーバー経由で静的ファイルにアクセスするための基本URLを定義します。
  • STATICFILES_DIRS: 静的アセットを含む追加のディレクトリを指定します。
  • STATICFILES_STORAGE: 静的ファイルを処理するストレージバックエンドを設定します。
  • collectstatic: すべてのアプリケーションディレクトリからすべての静的アセットをSTATIC_ROOTに集めます。

さらに読む:

Source:
https://www.sitepoint.com/managing-static-files-in-django-a-comprehensive-guide/