Skip to content
GitLab
Commits (2)
Masquer les modifications d'espaces
En ligne Côte à côte
frontend/index.html 0 → 100644
Voir le fichier @ a62358de
<!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>