🚀 Implementing SSO to Grafana with Django and JWT

🎯 Goal

Allow users logged into your Django app to seamlessly access Grafana using their existing login session. We'll use JWT tokens to authenticate users directly in Grafana without needing them to log in again.

🧩 Components Involved

• Django: Handles authentication and generates JWT tokens.

• React Frontend: Stores JWT and builds the Grafana access URL.

• Apache: Acts as a reverse proxy.

• Grafana: Configured to accept JWT tokens for authentication.

🔐 Step 1: Enable JWT Authentication in Grafana

Edit your grafana.ini or environment variables in your container:

[auth.jwt]
enabled = true
header_name = X-JWT-Assertion
email_claim = email
username_claim = sub
role_claim = role
auto_sign_up = true
url_login = true

✅ url_login = true lets us pass the token via URL query: ?auth_token=your.jwt.token.

🏗️ Step 2: Configure Apache as a Reverse Proxy (Optional)

If you're serving Grafana behind Apache:

<VirtualHost *:443>
    ServerName your-domain.com

    SSLEngine on
    SSLCertificateFile /path/to/fullchain.pem
    SSLCertificateKeyFile /path/to/privkey.pem

    ProxyPreserveHost On
    ProxyPass /grafana/ http://localhost:3000/
    ProxyPassReverse /grafana/ http://localhost:3000/

    # (Optional) For header-based forwarding
    RequestHeader unset Authorization
</VirtualHost>

🧠 Step 3: Generate JWT Token in Django

Install PyJWT:

pip install PyJWT

Sample JWT Generation Code (utils.py)

import jwt
import datetime
from django.conf import settings

def generate_grafana_jwt(user):
    payload = {
        "sub": user.username,
        "email": user.email,
        "role": "Viewer",  # or "Admin", "Editor"
        "exp": datetime.datetime.utcnow() + datetime.timedelta(hours=1),
        "iat": datetime.datetime.utcnow()
    }
    token = jwt.encode(payload, settings.GRAFANA_JWT_SECRET, algorithm="HS256")
    return token

Add in settings.py

GRAFANA_JWT_SECRET = 'your-very-secure-shared-secret'  # Must match Grafana config

🧪 Step 4: Create API Endpoint to Retrieve JWT Token

# views.py
from django.http import JsonResponse
from django.contrib.auth.decorators import login_required
from .utils import generate_grafana_jwt

@login_required
def get_grafana_token(request):
    token = generate_grafana_jwt(request.user)
    return JsonResponse({"token": token})

🖼️ Step 5: Build Grafana URL in React

// In your React app
import { useEffect, useState } from "react";

function GrafanaSSOLink() {
  const [grafanaUrl, setGrafanaUrl] = useState("");

  useEffect(() => {
    fetch("/api/get-grafana-token", {
      credentials: "include"
    })
      .then((res) => res.json())
      .then((data) => {
        const token = data.token;
        const grafanaURL = `https://your-domain.com/grafana/?auth_token=${token}`;
        setGrafanaUrl(grafanaURL);
      });
  }, []);

  return (
    <a href={grafanaUrl} target="_blank" rel="noopener noreferrer">
      Access Grafana Dashboard
    </a>
  );
}

🔐 Make sure your frontend and backend share cookies or auth headers to access the /get-grafana-token API securely.

🧪 Testing

1. Login to your Django app.

2. Open the React app and click the Grafana Dashboard link.

3. Grafana should open and log you in automatically with the passed JWT token.

🔐 Security Considerations

• Always use HTTPS to avoid token leakage.

• Store the secret securely and rotate periodically.

• Set a short expiry time on tokens.

• Restrict user roles in the token generation logic.

Thanks

Ankur Dev