Django にファイルをアップロードする

  2. プログラミングのヒント
  3. Django Howto's
  4. Django にファイルをアップロードする
Vaibhav Vaibhav 2023年1月30日
Django
  1. Django 環境を設定する
  2. Django プロジェクトのセットアップ
  3. サーバーをテストする
  4. settings.py ファイルを更新する
  5. モデルを作成する
  6. ファイルをアップロードするためのフォームを作成する
  7. ビューを追加
  8. urls.py ファイルを構成する
  9. テスト
Django にファイルをアップロードする

この記事では、Django でファイルをアップロードする方法について説明します。詳細を入力してファイルを選択するための簡単なフォームを使用して、簡単なアプリケーションを作成します。また、アップロードされたすべてのファイルを下の表に表示します。

先に進む前に、このプロジェクト用に新しいフォルダまたはディレクトリを作成して、整理しておくことをお勧めします。

Django 環境を設定する

このチュートリアルでは、仮想環境を使用します。仮想環境を使用することは必須ではありませんが、プロジェクトごとに固有の仮想環境を用意することをお勧めします。

仮想環境を構築するには、Python パッケージ virtualenv が必要です。マシンにインストールされていない場合は、次のコマンドを使用してダウンロードできます。

pip install virtualenv

パッケージをインストールしたので、環境を作成しましょう。

環境を作成するには、次のコマンドを実行します。

virtualenv environment

environment は、作成したばかりの仮想環境の名前です。この環境では、Python バージョンがマシンにグローバルにインストールされ、デフォルト以外のパッケージはインストールされません。

この環境をアクティブにして使用するには、次のコマンドを実行します。

environment\Scripts\activate

今、私たちは Django について学んでいるので、Django ライブラリをインストールする必要があります。また、ファイルのアップロードを学習しているため、画像を処理するために追加の Python パッケージが必要です。パッケージ名は Pillow です。すべての依存関係をインストールしましょう。

pip install django
pip install Pillow

または、

pip3 install django
pip3 install Pillow

この記事の執筆時点では、Django の最新バージョンは 3.2 であることに注意してください。

Django プロジェクトのセットアップ

Django プロジェクトを設定するには、最初に Django プロジェクトを作成し、アプリケーションを作成し、そのアプリケーションを登録して、最初の移行を行う必要があります。

Django プロジェクトを作成するには、次のコマンドを実行します。

django-admin startproject DjangoFileUpload

次に、次のコマンドを使用して、作業ディレクトリをこのプロジェクトに変更します。

cd DjangoFileUpload

Django プロジェクト内にアプリケーションを作成するには、次のコマンドを実行します。

django-admin startapp Core

または、

python manage.py startapp Core

Core はアプリケーションの名前です。

このアプリケーションを登録するには、settings.py ファイルのリスト INSTALLED_APPS 内にアプリケーションの名前を入力します。

  • settings.py
INSTALLED_APPS = [
    "django.contrib.admin",
    "django.contrib.auth",
    "django.contrib.contenttypes",
    "django.contrib.sessions",
    "django.contrib.messages",
    "django.contrib.staticfiles",
    "Core",  # Here
]

Django が正しく機能するには、いくつかのモデルが必要です。たとえば、認証システムまたはスーパーユーザーは、最初の移行なしでは機能しません。したがって、最初の移行を行うには、次のコマンドを実行します。

python manage.py migrate

出力：

Operations to perform:
  Apply all migrations: admin, auth, contenttypes, sessions
Running migrations:
  Applying contenttypes.0001_initial... OK
  Applying auth.0001_initial... OK
  Applying admin.0001_initial... OK
  Applying admin.0002_logentry_remove_auto_add... OK
  Applying admin.0003_logentry_add_action_flag_choices... OK
  Applying contenttypes.0002_remove_content_type_name... OK
  Applying auth.0002_alter_permission_name_max_length... OK
  Applying auth.0003_alter_user_email_max_length... OK
  Applying auth.0004_alter_user_username_opts... OK
  Applying auth.0005_alter_user_last_login_null... OK
  Applying auth.0006_require_contenttypes_0002... OK
  Applying auth.0007_alter_validators_add_error_messages... OK
  Applying auth.0008_alter_user_username_max_length... OK
  Applying auth.0009_alter_user_last_name_max_length... OK
  Applying auth.0010_alter_group_name_max_length... OK
  Applying auth.0011_update_proxy_permissions... OK
  Applying auth.0012_alter_user_first_name_max_length... OK
  Applying sessions.0001_initial... OK

サーバーをテストする

サーバーを実行するには、次のコマンドを使用します。すべてがエラーなしで実行された場合、Django サーバーが http://127.0.0.1:8000/で実行されていることを確認する必要があります。

python manage.py runserver

settings.py ファイルを更新する

アップロードしたファイルはどこかに保存する必要があります。Django では、デフォルトで、アップロードされたすべてのファイルは media フォルダーに保存されます。フォルダの名前とそれに関連付けられている URL はいつでも変更できますが、デフォルトの命名規則に従います。

メディアファイルへの URL MEDIA_URL とメディアフォルダへのパス MEDIA_ROOT を定義するには、settings.py ファイルに次のステートメントを追加します。

  • settings.py
import os

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

os モジュールをインポートすることを忘れないでください。そうしないと、Python はエラーをスローします。

モデルを作成する

アップロードしたファイルを保存するには、モデルを作成する必要があります。このモデルのフィールドは、アップロードされたファイルへのパスを保持しますが、ファイル自体は保持しません。

アップロードされたファイルの詳細を保存するためのモデル Document を作成します。

  • Core\models.py
from django.db import models


class Document(models.Model):
    title = models.CharField(max_length=200)
    uploadedFile = models.FileField(upload_to="Uploaded Files/")
    dateTimeOfUpload = models.DateTimeField(auto_now=True)

モデルには、アップロードされたファイルのカスタムタイトルを格納するための文字タイプの title フィールドがあり、dateTimeOfUpload はファイルのアップロードの日付と時刻を格納します。日時フィールドは、モデルオブジェクトの作成時に自動的に設定されます。

ファイルを保存するには、FileField() を使用しています。このタイプは、あらゆる種類のファイルを対象としています。ただし、画像を少し具体的にしたい場合は、ImageField() を使用して画像を保存できます。他のすべてのフィールドについては、FileField() に固執する必要があります。

upload_to パラメーターは、このモデルのファイルが media フォルダーにアップロードされるフォルダーを定義するために使用されます。

このモデルを使用する前に、移行を行って移行する必要があります。そのためには、次の 2つのコマンドを実行します。

python manage.py makemigrations
python manage.py migrate

ファイルをアップロードするためのフォームを作成する

Core アプリケーションまたはフォルダー内に、新しいフォルダー、つまり templates を作成します。このフォルダ内に、別のフォルダ、つまり Core を作成します。これは、アプリケーションの名前である必要があります。最後に、このフォルダー内に upload-file.html という新しいファイルを作成します。

これで、このようなファイル構造になります。

DjangoFileUpload/
    DjangoFileUpload/
        __init__.py
        asgi.py
        settings.py
        urls.py
        wsgi.py
    db.sqlite3
    manage.py
    Core/
        migrations/
        templates/
            Core/
                upload-file.html
        __init__.py
        admin.py
        apps.py
        models.py
        tests.py
        views.py

upload-file.html 内に、次の HTML を追加します。

  • Core\templates\Core\upload-file.html
<!DOCTYPE html>
{% load static %}
<html lang="en">
<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">
    <title>Django File Upload</title>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

        * {
            font-family: "Roboto";
        }

        body {
            background-color: #F5F5F5;
        }

        form {
            background-color: #FFFFFF;
            padding: 25px;
        }

        table {
            width: 100%; 
            text-align: center;
            margin-top: 25px;
            padding: 25px;
            background-color: #FFFFFF;
        }

        table tr td {
            padding-top: 15px;            
        }
    </style>
</head>
<body>
    <form action="{% url 'Core:uploadFile' %}" method="POST" enctype="multipart/form-data">
        <input type="text" name="fileTitle" placeholder="Enter a title">
        <input type="file" name="uploadedFile">
        {% csrf_token %}
        <input type="submit" value="Upload">
    </form>
    <table>
        <tr>
            <th>ID</th>
            <th>Title</th>
            <th>File Path</th>
            <th>Upload Date & Time</th>
        </tr>
        {% for file in files %}
            <tr>
                <td>{{ file.id }}</td>
                <td>{{ file.title }}</td>
                <td>{{ file.uploadedFile.url }}</td>
                <td>{{ file.dateTimeOfUpload }}</td>
            </tr>
        {% endfor %}
    </table>
</body>
</html>

表の中に、アップロードされたファイルに関する詳細が表示されます。

ビューを追加

HTML テンプレートとその情報を表示し、ファイルのアップロードを保存および処理するために、ビューuploadFile() を作成します。

次のコードを参照してください

  • Core\views.py
from . import models
from django.shortcuts import render


def uploadFile(request):
    if request.method == "POST":
        # Fetching the form data
        fileTitle = request.POST["fileTitle"]
        uploadedFile = request.FILES["uploadedFile"]

        # Saving the information in the database
        document = models.Document(title=fileTitle, uploadedFile=uploadedFile)
        document.save()

    documents = models.Document.objects.all()

    return render(request, "Core/upload-file.html", context={"files": documents})

このビューは、前のセクションで作成した HTML テンプレートをレンダリングします。HTML テンプレートのフォームは、同じ URL に送信され、このビューで処理されます。リクエストのメソッドが POST の場合、フォームに入力された情報とアップロードされたファイルを取得し、その情報をモデルに保存してモデルを保存します。

それ以外の場合、一般的なケースでは、アップロードされたすべてのファイルをフェッチし、それらをコンテキストディクショナリに送信して HTML テンプレートに表示します。

urls.py ファイルを構成する

最後に、URL を設定しましょう。先に進む前に、Core アプリケーションまたはフォルダー内に urls.py という新しいファイルを作成します。このファイルには、この Django アプリケーションに関連付けられているすべての URL が含まれます。Django アプリケーションごとに個別の urls.py ファイルを用意することをお勧めします。

このファイル内に、次のコードを追加します。

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

app_name = "Core"

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

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

HTML テンプレート upload-file.html の URL パターンを追加しました。また、メディアファイルの URL をもう 1つ追加しました。settings.py ファイルで宣言した定数変数を使用します。

Core アプリケーション内に新しい urls.py ファイルを作成したので、ここで定義した URL をメインプロジェクトにリンクする必要があります。

これを行うには、DjangoFileUpload\urls.py の urlpatterns リスト内に次のステートメントを追加します

path("", include("Core.urls")),

ファイルは次のようになります。

ファイル：DjangoFileUpload\urls.py

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path("admin/", admin.site.urls),
    path("", include("Core.urls")),
]

テスト

おめでとう！次に、プロジェクトをテストします。以下の手順に従ってください。

  • コマンドを使用してサーバーを起動します-python manage.py runserver
  • URL http://127.0.0.1:8000/に移動します
  • フォームにタイトルを入力し、ファイルを選択して、フォームを送信します。

これで、フォームの下の表にファイルに関する詳細が表示されます。

さらに、作業ディレクトリを確認すると、media という名前のフォルダが作成されており、このフォルダ内に Uploaded Files という名前の別のフォルダがあります。このフォルダには、アップロードされたすべてのファイルが含まれています。

写真、ビデオ、プログラム、PDF、JSON ファイル、HTML ファイルなどをアップロードできます。アップロード時間はファイルのサイズによって異なりますので、しばらくお待ちください。

著者： Vaibhav Vaibhav
Vaibhav Vaibhav avatar Vaibhav Vaibhav avatar

Vaibhav is an artificial intelligence and cloud computing stan. He likes to build end-to-end full-stack web and mobile applications. Besides computer science and technology, he loves playing cricket and badminton, going on bike rides, and doodling.