django-debug-toolbarが表示できない

django-debug-toolbarを導入した際にdebug_toolbarがなかなか表示できなかったので対策を書きます。

環境

  • Python：3.9
  • django：3.1.5
  • django-debug-toolbar：3.2

django_debug_toolbarの導入

まずはdjango_debug_toolbarをインストールします。

pipenvで仮想環境を作っているので仮想環境の外からpipenv installします。デバッグ用のパッケージなのでdevオプションをつけてインストールします。

PS > pipenv install --dev django-debug-toolbar

Pipfileのdev-packagesにdjango-debug-toolbarが追加されているのを確認します。

[dev-packages]
django-debug-toolbar = "*"

公式サイトを参照してdjnagoにdebug_toolbarを設定していきます。まずはsettings.pyに以下のコードを追加します。

if DEBUG:
    INTERNAL_IPS = ['127.0.0.1']
    INSTALLED_APPS += ['debug_toolbar']
    MIDDLEWARE += ['debug_toolbar.middleware.DebugToolbarMiddleware']
    DEBUG_TOOLBAR_PANELS = [
        'debug_toolbar.panels.versions.VersionsPanel',
        'debug_toolbar.panels.timer.TimerPanel',
        'debug_toolbar.panels.settings.SettingsPanel',
        'debug_toolbar.panels.headers.HeadersPanel',
        'debug_toolbar.panels.request.RequestPanel',
        'debug_toolbar.panels.sql.SQLPanel',
        'debug_toolbar.panels.staticfiles.StaticFilesPanel',
        'debug_toolbar.panels.templates.TemplatesPanel',
        'debug_toolbar.panels.cache.CachePanel',
        'debug_toolbar.panels.signals.SignalsPanel',
        'debug_toolbar.panels.logging.LoggingPanel',
        'debug_toolbar.panels.redirects.RedirectsPanel',
    ]
    DEBUG_TOOLBAR_CONFIG = {
        'SHOW_TEMPLATE_CONTEXT': lamda request: True,
    }
    RENDER_PANELS = True


urls.pyを設定します。debug_toolbar.urlsにはquote(")は付けません。

from config import settings

if settings.DEBUG:
    import debug_toolbar
    urlpatterns = [path('__debug__/', include(debug_toolbar.urls)),] + urlpatterns

runserverして動作確認する

設定が終わったのでrunserverして動作確認します。

PS > python .\manage.py runserver

MEMETYPEのエラーを解消する

debug_toolbarが表示されない場合、ブラウザのデベロッパーツールでエラーが出ていないか確認します。MEMETYPEに対するエラーの場合はこのようなエラーが表示されていると思います。

Loading module from "***/debug_toolbar/js/toolbar.js" was blocked because of a disallowed MEME type ("text/plain").

このような感じのエラーが出ていた場合は以下を追加で設定します。

if DEBUG:
    ...
    import mimetypes
    mimetypes.add_type("application/javascript"), ".js", True)

これでも改善しない場合は、レジストリエディタ(regedit)でWindowsのレジストリを書き換えてみます。レジストリエディタを開き、HKEY_CLASSES_ROOT\.js\ContentTypeの値を確認します。

ContentTypeが「text/plain」になっていると思いますので、この値を「text/javascript」に書き換えます。PCを再起動して再度runserverしてdebug_toolbarが動作しているか確認してみてください。

私はどちらも同時にやってしまったのでどちらが効果あったのか定かではないのですが、debug_toolbarは使えるようになりました。

プログラミングdjango,django-debug-toolbar,python

Posted by amauzpoo