index.html 4,19 ko
Newer Older
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Test Backend - MD5 Bruteforce</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            background-color: #f4f4f4;
        }
        h1 {
            text-align: center;
        }
        .container {
            max-width: 600px;
            margin: auto;
            padding: 20px;
            background: white;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            border-radius: 5px;
        }
        label, select, input, button {
            display: block;
            width: 100%;
            margin-bottom: 10px;
            padding: 10px;
        }
        button {
            background-color: #28a745;
            color: white;
            border: none;
            cursor: pointer;
        }
        button:hover {
            background-color: #218838;
        }
        .output {
            background: #eee;
            padding: 10px;
            border-radius: 5px;
            margin-top: 10px;
            font-family: monospace;
            white-space: pre-wrap;
        }
    </style>
</head>
<body>

<div class="container">
    <h1>MD5 Bruteforce Test</h1>

    <!-- Sélection du nombre de requêtes -->
    <label for="numRequests">Nombre de requêtes à envoyer :</label>
    <select id="numRequests">
        <option value="1">1</option>
        <option value="50">50</option>
        <option value="500">500</option>
    </select>
    <button onclick="sendRequests()">Envoyer</button>

    <!-- Saisie d'un hash -->
    <label for="hashInput">Entrer un hash MD5 :</label>
    <input type="text" id="hashInput" placeholder="Ex: 098f6bcd4621d373cade4e832627b4f6">
    <button onclick="bruteforce()">Bruteforce</button>

    <!-- Affichage des informations -->
    <h3>Statistiques en temps réel :</h3>
    <div class="output" id="replicasOutput">🔄 Chargement des réplicas...</div>
    <div class="output" id="cpuOutput">🔥 Chargement de l'utilisation CPU...</div>

    <!-- Nettoyage du cache -->
    <button onclick="clearCache()" style="background-color: red;">🗑️ Nettoyer le cache</button>

    <!-- Résultat bruteforce -->
    <h3>Résultat Bruteforce :</h3>
    <div class="output" id="bruteforceOutput">🔎 Aucune requête encore.</div>
</div>

<script>
    const API_BASE = "http://localhost:5000";  // Modifier si nécessaire

    async function sendRequests() {
        let numRequests = document.getElementById("numRequests").value;
        for (let i = 0; i < numRequests; i++) {
            fetch(`${API_BASE}/request_count`).catch(err => console.error(err));
        }
        alert(`${numRequests} requêtes envoyées !`);
    }

    async function bruteforce() {
        let hash = document.getElementById("hashInput").value;
        if (!hash) {
            alert("Veuillez entrer un hash !");
            return;
        }
        
        let response = await fetch(`${API_BASE}/bruteforce`, {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({ "hash": hash })
        });

        let data = await response.json();
        document.getElementById("bruteforceOutput").innerText = data.status === "success"
            ? `✅ Trouvé : ${data.data.original}`
            : `❌ Erreur : ${data.errors.message}`;
    }

    async function updateStats() {
        let replicasResp = await fetch(`${API_BASE}/replicas`);
        let replicasData = await replicasResp.json();
        document.getElementById("replicasOutput").innerText = `🔢 Réplicas : ${replicasData.data.replicas}`;

        let cpuResp = await fetch(`${API_BASE}/cpu_usage`);
        let cpuData = await cpuResp.json();
        document.getElementById("cpuOutput").innerText = `⚡ CPU : ${cpuData.data.cpu_usage}%`;

        setTimeout(updateStats, 5000); // Mise à jour toutes les 5 secondes
    }

    async function clearCache() {
        await fetch(`${API_BASE}/clear_cache`, { method: "DELETE" });
        alert("Cache nettoyé !");
    }

    updateStats();  // Lancer la mise à jour en temps réel au chargement de la page
</script>

</body>
</html>