Djangoでオブジェクトストレージを設定する方法

投稿日: 2019-11-08 2022-10-11
タグ: Development, DigitalOcean, Django, Object Storage, Programming Project, python, Solutions

序章

DigitalOcean Spacesは、オーディオ、ビデオ、画像、大量のテキストなどの非構造化データに最適なオブジェクトストレージソリューションです。スペースとオブジェクトストレージの詳細については、DigitalOceanSpacesの概要をお読みください。

このチュートリアルでは、Spacesで動作するようにDjangoアプリケーションをセットアップする方法について説明します。

前提条件

このチュートリアルを開始するには、いくつかの設定が必要です。

root以外のユーザーアカウント sudo DebianまたはUbuntuLinuxサーバーに設定された特権。これをまだ設定していない場合は、Ubuntu16.04または Debianチュートリアルの初期サーバー設定に従ってください。
さらに、DigitalOcean Spaceを作成し、APIキーを生成する必要があります。これに関するガイダンスについては、このチュートリアルに従ってスペースを作成し、APIキーを設定できます。

サーバーの初期設定とDigitalOceanSpaceおよびAPIキーがあれば、始める準備ができています。

ステップ1—仮想環境をセットアップする

まだ行っていない場合は、最初にサーバーを更新してアップグレードします。

sudo apt-get update && sudo apt-get -y upgrade

サーバーにはPython3が同梱されているはずですが、次のコマンドを実行して、サーバーがインストールされていることを確認できます。

sudo apt-get install python3

次に、pipをインストールしてPythonのソフトウェアパッケージを管理します。

sudo apt-get install -y python3-pip

最後に、 virtualenv モジュールをインストールして、プログラミング環境をセットアップできるようにします。

sudo pip3 install virtualenv

programmig環境に関する追加のガイダンスと情報については、仮想環境のセットアップについて読むことができます。

ステップ2— Djangoアプリを作成し、依存関係をインストールする

次に、DigitalOceanSpaceを利用するDjangoアプリの作成に進みます。

サーバーのホームディレクトリで、次のコマンドを実行してディレクトリ（この場合は、 django-apps という名前を付けます）を作成して、プロジェクトを保持し、ディレクトリに移動します。

mkdir django-apps
cd django-apps

このディレクトリ内に、次のコマンドを使用して仮想環境を作成します。 env と呼びますが、好きなように呼ぶことができます。

virtualenv env

これで環境をアクティブ化でき、コマンドラインのプレフィックスを変更することで環境内にいるというフィードバックを受け取ることができます。

. env/bin/activate

コマンドラインのプレフィックスを変更すると、環境内にいるというフィードバックが届きます。これは次のようになりますが、現在のディレクトリによって異なります。

環境内で、pipを使用してDjangoパッケージをインストールし、Djangoアプリを作成して実行できるようにします。 Djangoの詳細については、 DjangoDevelopmentに関するチュートリアルシリーズをお読みください。

pip install django

次に、次のコマンドを使用してプロジェクトを作成します。この場合は、mysiteと呼びます。

django-admin startproject mysite

次に、Boto3をインストールします。これはAWS SDK for Python であり、アプリケーションがS3、EC2、DigitalOceanSpacesなどと対話できるようにします。 DigitalOceanSpacesはAmazonS3と相互運用可能であるため、SpacesはBoto3などのツールと簡単に対話できます。 S3とSpacesの比較の詳細については、 Spacesdocsをご覧ください。

sudo pip install boto3

私たちのプロジェクトにとって重要なもう1つのライブラリは、django-storagesです。これは、Djangoのカスタムストレージバックエンドのコレクションです。これもpipでインストールします。

sudo pip install django-storages

Djangoアプリの環境内で依存関係を設定し、静的ディレクトリとテンプレートディレクトリを設定する準備が整いました。

ステップ3—ディレクトリとアセットを追加する

すべての依存関係が設定された環境で、次のように切り替えることができます。 mysite/mysite ディレクトリ、

cd ~/django-apps/mysite/mysite

以内 mysite/mysite ディレクトリで、次のコマンドを実行して静的ディレクトリとテンプレートディレクトリを作成します。

mkdir static && mkdir templates

次に、画像とCSSのサブディレクトリを作成します。 static ディレクトリ。

mkdir static/img && mkdir static/css

ディレクトリを作成したら、テストファイルをダウンロードして、最終的にオブジェクトストレージに追加します。に切り替えます img 画像をダウンロードするので、ディレクトリ。

cd ~/django-apps/mysite/mysite/static/img

このディレクトリ内で、Wgetのを使用してDigitalOceanロゴ画像をダウンロードします wget 指図。これは、Webサーバーからコンテンツを取得するためにUbuntuディストリビューションにプリインストールされている一般的に使用されるGNUプログラムです。

wget https://assets.digitalocean.com/logos/DO_Logo_icon_blue.png

次のような出力が表示されます。

OutputResolving www.digitalocean.com (www.digitalocean.com)... 104.16.24.4, 104.16.25.4
Connecting to www.digitalocean.com (www.digitalocean.com)|104.16.24.4|:443... connected.
HTTP request sent, awaiting response... 200 OK
Length: 1283 (1.3K) [image/png]
Saving to: ‘DO_Logo_icon_blue.png’

DO_Logo_icon_blue-6edd7377 100%[=====================================>]   1.25K  --.-KB/s    in 0s      

2017-11-05 12:26:24 (9.60 MB/s) - ‘DO_Logo_icon_blue.png’ saved [1283/1283]

この時点で、コマンドを実行すると ls、という名前の画像に気付くでしょう DO_Logo_icon_blue.png 今に存在します static/img/ ディレクトリ。

これらのディレクトリが設定され、画像がサーバーにダウンロードされて保存されるので、Djangoアプリに関連付けられたファイルの編集に進むことができます。

ステップ4—CSSおよびHTMLファイルを編集する

まず、スタイルシートを編集します。あなたはに移動する必要があります css ディレクトリを作成して、Webアプリの基本的なスタイルシートを追加できるようにします。

cd ~/django-apps/mysite/mysite/static/css

nano、または選択した別のテキストエディタを使用して、ドキュメントを編集します。

nano app.css

ファイルが開いたら、次のCSSを追加します。

app.css

body {
  margin: 0;
  background-color: #f1f1f1;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.container {
  width: 80%;
  border: 1px solid #ddd;
  background-color: #fff;
  padding: 20px;
  margin: 40px auto;
}

form {
  margin-bottom: 20px;
  padding: 10px;
  border: 1px solid #ff9900;
  width: 350px;
}

table {
  border-collapse: collapse;
  width: 100%;
}

table td,
table th {
  border: 1px solid #eceeef;
  padding: 5px 8px;
  text-align: left;
}

table thead {
  border-bottom: 2px solid #eceeef;
}

終了したら、ファイルを保存して閉じることができます。ここから、に移動します templates ディレクトリ。

cd ~/django-apps/mysite/mysite/templates

というファイルを開く必要があります home.html 基本的なWebアプリの表示方法にHTMLを追加します。 nanoを使用してファイルを開き、編集できるようにします。

nano home.html

ドキュメント内に、以下を追加します。

home.html

{% load static %}
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Spaces + Django Tutorial</title>
  <link rel="stylesheet" type="text/css" href="{% static 'css/app.css' %}">
</head>
<body>
  <center>
  <header>
    <h1>Spaces + Django Tutorial</h1>
  </header>
  <main>
    <img src="{% static 'img/DO_Logo_icon_blue.png' %}">
    <h2>Congratulations, you’re using Spaces!</h2>
  </main>
  </center>
</body>
</html>

ファイルを保存して閉じます。更新する最後のファイルは urls.py 新しく作成したファイルを指すようにファイルします home.html ファイル。次のディレクトリに移動する必要があります。

cd ~/django-apps/mysite/mysite

nanoを使用してurls.pyファイルを編集します。

nano urls.py

ファイル内のすべてを削除してから、以下を追加できます。

urls.py

from django.conf.urls import url
from django.views.generic import TemplateView


urlpatterns = [
    url(r'^$', TemplateView.as_view(template_name='home.html'), name='home'),
]

これらのファイルを設定したら、編集に進むことができます settings.py オブジェクトストレージと統合するためのファイル。

ステップ5—設定を更新する

次に、設定ファイルをSpacesのクレデンシャルで更新します。これにより、設定したページを利用して画像を表示できるようになります。

この例では、簡潔にするためにクレデンシャルをハードコーディングしますが、これは本番環境のセットアップには十分に安全ではないことに注意してください。 Python Decouple のようなパッケージを使用して、Spacesのクレデンシャルをマスクすることをお勧めします。このパッケージは、設定パラメーターをソースコードから分離します。これは、本番環境グレードのDjangoアプリケーションに必要です。

まず、設定ファイルの場所に移動します。

cd ~/django-apps/mysite/mysite

nanoを使用して、編集用にファイルを開きます。

nano settings.py

サーバーのIPを許可されたホストとして追加します。

settings.py

...
ALLOWED_HOSTS = ['your-server-ip']
...

それから加えて storages 設定ファイルのインストール済みアプリセクションに移動し、削除します django.contrib.admin このチュートリアルでは使用しないためです。次のようになります。

settings.py

...
# Application definition

INSTALLED_APPS = [
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'storages'
]
...

強調表示されたテキストを置き換えて追加します TEMPLATES 設定ファイルのセクション。これにより、プロジェクトはhome.htmlファイルの場所を認識できます。

settings.py

...
TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'mysite/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',
            ],
        },
    },
]
...

最後に、ファイルの下部にある設定を更新しましょう。以下に以下を追加します # Static files セクション。独自のアクセスキー、バケット名、およびファイルを保存するディレクトリを必ず追加してください。 Spacesインターフェイスのブラウザ内からディレクトリを追加できます。執筆時点では、NYC3はSpacesが現在存在する唯一のリージョンであるため、エンドポイントURLとして渡されています。

settings.py

...
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.11/howto/static-files/

AWS_ACCESS_KEY_ID = 'your-spaces-access-key'
AWS_SECRET_ACCESS_KEY = 'your-spaces-secret-access-key'
AWS_STORAGE_BUCKET_NAME = 'your-storage-bucket-name'
AWS_S3_ENDPOINT_URL = 'https://nyc3.digitaloceanspaces.com'
AWS_S3_OBJECT_PARAMETERS = {
    'CacheControl': 'max-age=86400',
}
AWS_LOCATION = 'your-spaces-files-folder'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'mysite/static'),
]
STATIC_URL = 'https://%s/%s/' % (AWS_S3_ENDPOINT_URL, AWS_LOCATION)
STATICFILES_STORAGE = 'storages.backends.s3boto3.S3Boto3Storage'

これで、設定ファイルでDjangoアプリをオブジェクトストレージと統合する準備が整いました。

ステップ6—静的ファイルを収集する

今、実行します collectstatic 静的ディレクトリに保存した画像など、ファイルが転送されていることに気付くでしょう。設定ファイルで特定したスペースの場所に転送されます。

これを達成するために、に移動しましょう ~/django-apps/mysite/ :

cd ~/django-apps/mysite

ディレクトリ内で、次のコマンドを実行します。

python manage.py collectstatic

次の出力が表示され、プロンプトが表示されたらyesと応答するはずです。

OutputYou have requested to collect static files at the destination
location as specified in your settings.

This will overwrite existing files!
Are you sure you want to do this?

Type 'yes' to continue, or 'no' to cancel:

次に、ファイルがSpacesにコピーされたことを示す出力がさらに表示されます。

OutputCopying '/root/django-apps/mysite/mysite/static/css/app.css'

1 static file copied, 1 unmodified.

この時点で、DigitalOcean Cloudアカウントからバケットに戻ると、 css と img あなたがそれらを指し示したフォルダに追加されたディレクトリ、 app.css の中に css ディレクトリ、および DO-Logo_icon_blue-.png の画像 img ディレクトリ。

ステップ7—アプリケーションをテストする

すべてがセットアップされ、ファイルがオブジェクトストレージにあるので、静的ファイルが提供されているページに移動して、アプリケーションをテストできます。

まず、次のコマンドを発行して、ファイアウォールがトラフィックがポート8000を通過できるようにすることを確認しましょう。

sudo ufw allow 8000

これで、サーバーのIPアドレスを参照し、ポート8000を使用して、サーバーを実行できます。

python manage.py runserver your-server-ip:8000

Webブラウザーで、に移動します。 http://your-server-ip:8000 作成したDjangoアプリケーションの結果を確認します。ブラウザに次の出力が表示されます。

アプリのテストが終了したら、を押すことができます CTRL + C 停止するには runserver 指図。これにより、プログラミング環境に戻ります。

Python環境を離れる準備ができたら、 deactivate 指図：

deactivate

プログラミング環境を非アクティブ化すると、ターミナルコマンドプロンプトに戻ります。

結論

このチュートリアルでは、DigitalOceanSpacesからファイルを提供するDjangoアプリケーションを正常に作成しました。このプロセスでは、静的ファイル、静的ファイルを管理する方法、およびクラウドサービスから静的ファイルを提供する方法について学習しました。

Django Development のチュートリアルシリーズを読むことで、PythonとDjangoを使用したWeb開発について引き続き学習できます。

getdocs

13036