Djangoでオブジェクトストレージをセットアップする方法

前書き

DigitalOcean Spacesはオブジェクトストレージソリューションであり、オーディオ、ビデオ、画像、大量のテキストなどの非構造化データに最適です。 スペースとオブジェクトストレージの詳細については、https://www.digitalocean.com/community/tutorials/an-introduction-to-digitalocean-spaces [DigitalOcean Spacesの概要]をご覧ください。

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

前提条件

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

  • DebianまたはUbuntu Linuxサーバーに設定された `+ sudo +`特権を持つ非ルートユーザーアカウント。 これをまだ設定していない場合は、https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04 [Ubuntu 16.04の初期サーバーセットアップ]またはhttpsに従ってください。 //www.digitalocean.com/community/tutorials/initial-server-setup-with-debian-8[Debian]チュートリアル。

  • さらに、DigitalOcean Spaceを作成し、APIキーを生成する必要があります。 これに関するガイダンスについては、https://www.digitalocean.com/community/tutorials/how-to-create-a-digitalocean-space-and-api-key [tutorial]に従って、スペースを作成し、 APIキー]。

最初のサーバーをセットアップし、DigitalOcean SpaceとAPIキーを用意したら、準備は完了です。

ステップ1-仮想環境のセットアップ

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

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

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

sudo apt-get install python3

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

sudo apt-get install -y python3-pip

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

sudo pip3 install virtualenv

programmig環境に関する追加のガイダンスと情報については、https://www.digitalocean.com/community/tutorials/how-to-install-python-3-and-set-up-a-programming-environment-onについて読むことができます。 -an-ubuntu-16-04-server [仮想環境のセットアップ]。

ステップ2-Djangoアプリの作成と依存関係のインストール

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

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

mkdir
cd

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

virtualenv

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

. env/bin/activate

コマンドラインのプレフィックスの変更により、環境にいるというフィードバックを受け取ります。 次のようになりますが、現在のディレクトリに応じて変わります。

環境内で、Djangoアプリを作成して実行できるように、pipでDjangoパッケージをインストールします。 Djangoの詳細については、https://www.digitalocean.com/community/tutorial_series/django-development [Django Development]のチュートリアルシリーズをご覧ください。

pip install django

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

django-admin startproject

次に、アプリケーションがS3、EC2、DigitalOcean Spacesなどとやり取りできるようにするhttps://boto3.readthedocs.io/en/latest/[AWS SDK for Python]であるBoto 3をインストールします。 DigitalOcean SpacesはAmazon S3と相互運用できるため、SpacesはBoto 3などのツールと簡単にやり取りできます。 S3とSpacesの比較の詳細については、https://developers.digitalocean.com/documentation/spaces/ [Spaces docs]をご覧ください。

sudo pip install boto3

このプロジェクトに不可欠なもう1つのライブラリはdjango-storagesです。これはhttps://django-storages.readthedocs.io/en/latest/[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の「+ wget +」コマンドを使用してDigitalOceanロゴ画像をダウンロードします。 これは、Ubuntuディストリビューションにプリインストールされ、Webサーバーからコンテンツを取得するためによく使用されるGNUプログラムです。

wget http://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ファイルの編集

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

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の資格情報で更新して、セットアップしたページを利用して画像を表示できるようにします。

この例では、簡潔にするために資格情報をハードコーディングすることに注意してください。ただし、これは本番環境のセットアップには十分ではありません。 * https://pypi.python.org/pypi/python-decouple [Python Decouple] *のようなパッケージを使用して、Spaces資格情報をマスクすることをお勧めします。 このパッケージは、プロダクショングレードのDjangoアプリケーションに必要なソースコードから設定パラメーターを分離します。

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

cd ~/django-apps/mysite/mysite

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

nano settings.py

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

settings.py

...
ALLOWED_HOSTS = ['']
...

次に、このチュートリアルでは使用しないため、設定ファイルのインストール済みアプリセクションに「+ 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',

]
...

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

settings.py

...
TEMPLATES = [
   {
       'BACKEND': 'django.template.backends.django.DjangoTemplates',
       'DIRS': [],
       '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 = ''
AWS_SECRET_ACCESS_KEY = ''
AWS_STORAGE_BUCKET_NAME = ''
AWS_S3_ENDPOINT_URL = 'https://nyc3.digitaloceanspaces.com'
AWS_S3_OBJECT_PARAMETERS = {
   'CacheControl': 'max-age=86400',
}
AWS_LOCATION = ''

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 +」を実行すると、静的ディレクトリに保存した画像を含むファイルが転送されていることがわかります。 設定ファイルで特定したSpacesの場所に転送されます。

これを達成するために、 `+〜/ 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 + `ディレクトリ、および + img + ディレクトリ内の + DO-Logo_icon_blue-.png + `画像。

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

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

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

sudo ufw allow 8000

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

python manage.py runserver :8000

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

image:https://assets.digitalocean.com/articles/eng_python/django/spaces-django.png [DigitalOcean Spaces Django Example App]

アプリのテストが完了したら、 + CTRL + + `+ C `を押して ` runserver +`コマンドを停止できます。 これにより、プログラミング環境に戻ります。

Python環境を離れる準備ができたら、 `+ deactivate +`コマンドを実行できます:

deactivate

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

結論

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

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

Related