☁️

DjangoのHeroku環境でCloudinaryを使う

2023/04/24に公開

https://zenn.dev/treefield/articles/f6e8b879387d02
上記の記事を書いたときに、Heroku で画像のアップロードができませんでした。Heroku では AWS や Cloudinary で別途ストレージを用意しないといけないということで、無料の Cloudinary を使ってみました。
今回は、モデルのイメージフィールドには、CloudinaryFieldなどは使わず、以下のようにDjangoのImageFieldをそのまま使用します。

    image = models.ImageField(verbose_name="画像", upload_to='uploads/', null=True, blank=True)

cloudinary 1.32.0
django-cloudinary-storage 0.3.0

1.Cloudinaryの設定

Heroku の Personalページでデプロイしたアプリのページを開き、Resources の Add-on 検索で Cloudinary を追加して Starter(Free)Plan を選択します。
その後、Cloudinary のリンクからアカウント画面へ行き、ダッシュボードを開くと、APIキーなどが表示されます。 API Environment variable の CLOUDINARY_URL を後程使用します。

2.settings.pyを修正

まずは、MEDIA_URL を以下のように設定します。

MEDIA_URL = '/media/'

デプロイ先(Heroku環境)の場合に、INSTALLED_APPS に以下のように Cloudinary 関連を追加します。DEFAULT_FILE_STORAGE も設定します。
if not DEBUG: 配下に書いてデプロイ先(Heroku環境)でのみ実行されるようにします。settings.pyの詳細は上記記事を参照ください。

if not DEBUG:

    ...

    #INSTALLED_APPSにcloudinaryの追加
    INSTALLED_APPS.append('cloudinary')
    INSTALLED_APPS.append('cloudinary_storage')

    #画像
    DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.MediaCloudinaryStorage'

DEFAULT_FILE_STORAGE を動画やその他のファイルにしたい場合は以下のようになります。

    #動画
    DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.VideoMediaCloudinaryStorage'
    #その他のファイル
    DEFAULT_FILE_STORAGE = 'cloudinary_storage.storage.RawMediaCloudinaryStorage'

3.ライブラリをインストール

仮想環境に django-cloudinary-storage をインストールします。

% pip install django-cloudinary-storage

requirements.txtを更新。

% pip freeze > requirements.txt

4.デプロイ

Herokuへログイン

% heroku login

ローカルリポジトリへコミット。

% git add -A
% git commit -m "Use Cloudinary"

上記「1.Cloudinaryの設定」の Cloudinary のダッシュボードで API Environment variable の CLOUDINARY_URL をコピーし Herokuの環境変数に設定します。

% heroku config:set CLOUDINARY_URL=cloudinary://<api_key>:<api_secret>@<cloud_name>

CLOUDINARY_URL は、Heroku のアプリ管理画面の Settings から設定することもできます。Settings 画面の Config Vars で、Reveal Config Vars をクリックすると、環境変数を設定できます。
上記のように shell コマンドで設定した場合も Config Vars で設定されているのを確認できます。

プッシュします。

% git push heroku main 

必要な場合、マイグレーションをします。

% heroku run python manage.py migrate

以上で、画像をアップロードして表示することができるようになりました。

参考にしたサイト
https://pypi.org/project/django-cloudinary-storage/
https://juliana-ny2008.medium.com/heroku-cloudinary-storage-b665a26217e9

Discussion