Final Submission for SecOps Exam
هذا الالتزام موجود في:
Ammar Yaser Al-Sayyed Abdullah
56
q4-simple-siem/dashboard.html
Normal file
56
q4-simple-siem/dashboard.html
Normal file
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ar" dir="rtl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>SIEM Dashboard - Ghaymah</title>
|
||||
<style>
|
||||
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f4f7f6; margin: 0; padding: 20px; }
|
||||
.card { background: white; padding: 20px; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); }
|
||||
table { width: 100%; border-collapse: collapse; margin-top: 15px; }
|
||||
th, td { padding: 12px; border-bottom: 1px solid #ddd; text-align: right; }
|
||||
th { background-color: #2c3e50; color: white; }
|
||||
.alert-high { color: #e74c3c; font-weight: bold; }
|
||||
.ip-address { font-family: monospace; background: #eee; padding: 2px 6px; border-radius: 4px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>🛡️ لوحة مراقبة SIEM - غيمة</h1>
|
||||
|
||||
<div class="card">
|
||||
<h2>التنبيهات الأمنية المكتشفة</h2>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>وقت الحدث</th>
|
||||
<th>نوع التهديد</th>
|
||||
<th>عنوان IP المشبوه</th>
|
||||
<th>تفاصيل السجل</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="alerts-table">
|
||||
<!-- Data is injected via JavaScript -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// محاكاة استدعاء ملف alerts.json الذي ينتجه البايثون
|
||||
const alertsData = [
|
||||
{ timestamp: "2026-07-26 14:30:00", type: "Brute Force Attempt", source_ip: "192.168.1.50", raw_log: "[AUTH] Failed password for admin" },
|
||||
{ timestamp: "2026-07-26 14:31:15", type: "SQL Injection", source_ip: "Unknown", raw_log: "[WEB] GET /api/data?id=1' OR 1=1-- HTTP/1.1" },
|
||||
{ timestamp: "2026-07-26 14:35:10", type: "Port Scanning", source_ip: "10.0.0.9", raw_log: "[FIREWALL] BLOCK TCP SRC=10.0.0.9 DPT=22" }
|
||||
];
|
||||
|
||||
const tableBody = document.getElementById('alerts-table');
|
||||
alertsData.forEach(alert => {
|
||||
const row = `<tr>
|
||||
<td>${alert.timestamp}</td>
|
||||
<td class="alert-high">${alert.type}</td>
|
||||
<td><span class="ip-address">${alert.source_ip}</span></td>
|
||||
<td dir="ltr" style="text-align: left;"><code>${alert.raw_log}</code></td>
|
||||
</tr>`;
|
||||
tableBody.innerHTML += row;
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
المرجع في مشكلة جديدة
حظر مستخدم