【Django】公開環境(Debug=False)で画像を表示

　今回、Djangoの公開環境で画像を表示してみたので投稿します。

　プロジェクト名直下（managa.pyと同じディレクトリ）にstaticディレクトリ作成します。

　settings.pyに以下の行を追加します。

    #プロジェクト名/settings.py
    import os
    STATIC_ROOT = os.path.join(BASE_DIR, 'static')
    

　VPSの/etc/apache2/apache2.confの以下の部分を変更します。:set numberで番号を表示すると232行目辺りかと思われます。黄色の部分はすでに変更済みかも知れません。

    #/etc/apache2/apache2.conf
    WSGIScriptAlias / /home/hogehoge/プロジェクト名/プロジェクト名/wsgi.py
    WSGIPythonPath /home/hogehoge/プロジェクト名
    <Directory /home/hogehoge/プロジェクト名/static> # 公開環境で画像を表示する設定
        Require all granted
    </Directory>
    <Directory /home/hogehoge/プロジェクト名/プロジェクト名>
        <Files wsgi.py>
            Require all granted
        </Files>
    </Directory>

　vim /etc/apache2/apache2.confを実行してiキーでinsertモードにして修正します。修正が終わったらescキーを押してinsertモードを抜けます。:wq!でvimから抜けます。（:wqでもいいのですがエラーが出る場合があります。）

　VPSのターミナルでpython manage.py collectstaticを実行します。

    #ターミナル
    python manage.py collectstatic
    

　staticディレクトリ内にadminというディレクトリが作成されます。

　staticディレクトリ内（adminと同じ階層）にアプリ名と同じ名前のディレクトリを作成し、その中に画像ファイルを配置します。
　ターミナルで「mkdir アプリ名」を実行してディレクトリを作成しFileZillaなどのFTPソフトで画像ファイルを転送する形になると思います。

　テンプレートファイルを以下の様に作成します。

    #templates/アプリ名/index.html
    {% load static %}
    <img src="{% static 'download.jpg' %}">
    

　imgタグにstyle属性やBootstrapのclass属性を追加することでcssやレスポンシブデザインに対応させることもできます。

　ターミナルでsudo service apache2 restartを実行すると画像が表示できたのではないかと思います。

　以上です。

　分かりにくい部分などありましたらお知らせ頂けると助かります。お知らせいただいた内容は公開されることはありません。どの記事から投稿されたかは分かるようにしています。

お名前：

メールアドレス：

送信