前回までのあらすじ
Djangoで作成したアプリをHerokuにデプロイするための準備を行い、静的ファイル処理（whitenoise）とデータベース（PostgreSQL）を取り扱うための設定をしました。
目次
クラウドストレージの利用
Herokuではアップロードされたファイルは一時的に保存されます。
しかし、アプリの再起動や新しいデプロイが行われるたびに、これらのファイルが消去されるため、長期保存には向いていません。
そのため、画像などのメディアデータはAmazon S3やCloudinaryといったクラウドストレージサービスを介して扱うのが一般的です。
今回は、無料プランが用意されている（2024年10月現在）Cloudinaryを用いて画像ファイルを保存し、読み込めるように設定します。
Cloudinaryの追加
Cloudinaryのプランの内容については、こちらからご確認ください。
プランは無料プランであるstarterを選択します。
では、ターミナルから次のコマンドを入力して、Cloudinaryのアドオンを追加します。
$ heroku addons:create cloudinary:starter
アドオンが正常に追加されているか確認するために、次のコマンドを入力します。
$ heroku addons
Cloudinaryが追加されていることを確認して次に進みましょう。
環境変数の確認と設定
Cloudinaryを追加した際に環境変数CLOUDINARY_URLが自動で設定されています。
まずは、次のコマンドを入力してHerokuに設定されている環境変数の一覧を表示させましょう。
$ heroku config
出力された環境変数の中にCLOUDINARY_URLが確認できると思います。
このCLOUDINARY_URLの値は以下のような構成となっています。
CLOUDINARY_URL: cloudinary://<api_key>:<api_secret>@<cloud_name>
この中にあるapi_key, api_secret, cloud_name を使ってこの先の設定を進めます。
では、.envファイルにこれらの環境変数を定義しましょう。
CLOUD_NAME='<cloud_name>' CLOUDINARY_API_KEY='<api_key>' CLOUDINARY_API_SECRET='<api_secret>' # シングルまたはダブルクォートで囲むのを忘れずに
次にHerokuの環境変数をHeroku CLIを使って設定します（Herokuダッシュボードから入力してもOKです）。
$ heroku config:set CLOUD_NAME=<cloud_name> $ heroku config:set CLOUDINARY_API_KEY=<api_key> $ heroku config:set CLOUDINARY_API_SECRET=<api_secret> # シングルまたはダブルクォートは不要です
注）
ローカル環境と本番環境でアップロード先を同じにすることはお勧めできません（今回はCloudinaryの設定を解説するためにこのようにしています）。
ローカル環境のアップロード先はローカルのディレクトリにすることが望まれます。
base.pyの設定
共通する設定を記述したbase.pyにアプリの登録とストレージの設定を記述します。
アプリの登録
Cloudinaryを使用するためにINSTALLED_APPSのリストの中にcloudinary_storageとcloudinaryを追加します。
INSTALLED_APPS = [
'django.contrib.admin',
（略）
'django.contrib.staticfiles',
'cloudinary_storage', # 追加
'cloudinary', # 追加
]
ストレージの設定
静的ファイルの設定編で設定したSTORAGESに設定を追加します。
STORAGESに追記する内容は以下のとおりです。
'default': {"BACKEND": 'cloudinary_storage.storage.MediaCloudinaryStorage',}
追加後のSTORAGESはこのようになります。
STORAGES = {
# 静的ファイル
'staticfiles': {
'BACKEND': 'whitenoise.storage.CompressedManifestStaticFilesStorage',
},
# 画像アップロード
'default': {
"BACKEND": 'cloudinary_storage.storage.MediaCloudinaryStorage',
},
}
アップロード設定
今回はローカル環境と本番環境で同じアップロード先としていますので、local.pyとproduction.pyに記述する内容は同じです。
ということで、次のコードをlocal.py、production.pyそれぞれのファイルの最後に付け足します。
CLOUDINARY_STORAGE = {
'CLOUD_NAME': env('CLOUD_NAME'),
'API_KEY': env('CLOUDINARY_API_KEY'),
'API_SECRET': env('CLOUDINARY_API_SECRET')
}
以上で設定は完了です。
最後にローカル環境、本番環境で画像をアップロードとアプリで読み込んで動作確認しましょう。
大変お疲れ様でした！
全５回にわたってHerokuの設定について取り上げましたが、いかがだったでしょうか？
私自身、このような設定が本当に苦手で公式チュートリアルや生成AIなどあらゆるツールを使ってトライ・アンド・エラーを繰り返し設定を完了させました。
そこでの学びをアウトプットするという目的もあり本シリーズの記事を作成しました。
本シリーズがHerokuの設定で心が折れそうになっている方の助けになれば幸いです。
次の記事は１０月の学習内容の振り返り記事になるかと思います。
では、また次の記事で！✋️
