技術

Django サイトに Google Analytics を連携する実装手順

レザボア・コンサルティングの中西です。

Webサイトのアクセス解析は、ユーザー行動の把握やマーケティング施策の効果測定に欠かせません。

Google Analytics は無料で利用できる強力なアクセス解析ツールであり、Django で作成したWebサイトにも簡単に導入することができます。

本記事では、Django サイトへの Google Analytics 連携方法を、具体的なコードを交えて解説します。

なぜ単純にスクリプトを貼り付けるだけではダメなのか

Google Analytics を導入する際、提供されるトラッキングコードをHTMLに直接貼り付けるだけでも技術的には動作します。
しかし、Djangoのような本格的なWebフレームワークでプロジェクトを開発する場合は推奨しかねます。

例えば、開発環境と本番環境で同じトラッキングコードが使われてしまい、開発中のアクセスも計測データに混入するといった問題が生じます。
トラッキングIDがソースコードに直接埋め込まれることで、Git 等のリポジトリへ反映されてしまうのもリスクです。

特定の条件下でのみトラッキングを行うといった高度な実装も困難ですね。

これらの問題を解決するため、本記事では環境変数とコンテキストプロセッサを活用した、より堅牢で保守性の高い実装方法を紹介します。

「何かのキーとかIDをそのままコードに含めるのは良くないのでは」という感覚は常に持っておきましょう。

前提条件

  • Google Analyticsのアカウント作成済み
  • Analyticsプロパティの設定完了
  • G-から始まるGタグ（測定ID）の発行済み（GA4に対応した内容です）

実装手順

1. 環境変数にGoogle Analytics IDを定義

セキュリティと環境分離の観点から、Google Analytics IDは環境変数として定義するのがベストプラクティスです。
.envファイルや本番環境の環境変数設定などで以下のように定義します。

GOOGLE_ANALYTICS_ID=G-XXXXXXXXXX

2. settings.pyで環境変数を読み込む

Djangoプロジェクトの settings.py で環境変数を読み込みます。

import os
from dotenv import load_dotenv

# .envファイルを読み込む場合
load_dotenv()

# Google Analytics設定
GOOGLE_ANALYTICS_ID = os.getenv('GOOGLE_ANALYTICS_ID', '')

''（空文字）をデフォルト値として設定しておくことで、環境変数が未設定の場合でもエラーが発生しません。開発環境ではアクセス解析を行わない場合など、柔軟に対応できます。

（補足1）設定するファイルについて

settings.py は Django の初期設定時に作成される設定ファイルです。
実開発においては、 base.py や development.py など、環境別に分けて作成すると管理しやすくなります。

（補足2）環境変数の読み込みについて

上記の例では、 python-dotenv を用いて環境変数を読み込んでいます。
Django の場合は、 django-environ を使用することも多いと思います。その場合は以下のように書きましょう。

import environ

# environ初期化
env = environ.Env()

# .envファイルを読み込む場合
environ.Env.read_env()

# Google Analytics設定
GOOGLE_ANALYTICS_ID = env('GOOGLE_ANALYTICS_ID', default='')

※型安全を厳密に求める場合は env.str を使いましょう。

3. コンテキストプロセッサの作成

テンプレート内でGoogle Analytics IDを使用できるよう、コンテキストプロセッサを作成します。apps/common/context_processors.pyなどのファイルを作成し、以下のコードを記述します。

※プロジェクトの構成に応じて適切な場所に配置してください。

from django.conf import settings

def google_analytics(request):
    """
    Google Analytics IDをテンプレートに提供するコンテキストプロセッサ
    """
    return {
        'GOOGLE_ANALYTICS_ID': getattr(settings, 'GOOGLE_ANALYTICS_ID', ''),
    }

getattr関数を使用することで、settingsにGOOGLE_ANALYTICS_IDが存在しない場合でも安全に処理できます。

4. コンテキストプロセッサの登録

作成したコンテキストプロセッサをsettings.pyのTEMPLATES設定に追加します。

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [
            os.path.join(BASE_DIR, 'templates'),
        ],
        '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',
                # カスタムコンテキストプロセッサ
                'apps.common.context_processors.google_analytics',
            ],
        },
    },
]

5. テンプレートにGoogle Analyticsのトラッキングコードを追加

ベーステンプレートの<head>セクション内に、Google Analyticsのトラッキングコードを追加します。base.htmlや_base.htmlなどのファイルを編集します。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>{% block title %}サイトタイトル{% endblock %}</title>

    <!-- Google Analytics -->
    {% if GOOGLE_ANALYTICS_ID %}
    <script async src="https://www.googletagmanager.com/gtag/js?id={{ GOOGLE_ANALYTICS_ID }}"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());
        gtag('config', '{{ GOOGLE_ANALYTICS_ID }}');
    </script>
    {% endif %}

    <!-- その他のhead要素 -->
</head>
<body>
    {% block content %}{% endblock %}
</body>
</html>

{% if GOOGLE_ANALYTICS_ID %}条件分岐を追加することで、Google Analytics IDが設定されていない環境（ローカル開発環境など）では、トラッキングコードが挿入されないようにしています。

動作確認

実装が完了したら、ブラウザの開発者ツールを開き、Networkタブでgtag/jsファイルがロードされていることを確認しましょう。

Google Analytics の管理画面で、リアルタイムレポートにアクセスが記録されていることも併せて確認しておきましょう。

なお、設定後すぐには Google Analytics の管理画面に反映されない場合があります。
気長に待ちましょう。

おわりに

以上の手順で、Django サイトに Google Analytics を連携することができます。

ぜひ参考にしてみてください。

おまけ

settings.py で Analytics ID が空だったらログに警告出すような記述も便利です。

if not GOOGLE_ANALYTICS_ID:
    import warnings
    warnings.warn('Google Analytics ID is not set. Tracking will be disabled.')

「設定ミスってたのに気づかなかった事件」を未然に防げます。

他の大事な変数もこのように定義しておくとミスが減るので、応用が効きますよ。

関連記事

TOP