ahmedMibrahim/ghaymah-exam-ahmedmohamed-SecOps
1
0
نسخ 0
الشفرة المشكلات طلبات السحب Actions Packages المشاريع الإصدارات الويكي النشاط

add the main file structure requirements

تصفح المصدر
هذا الالتزام موجود في:
Ahmed Mohamed Ibrahim
2026-07-26 22:46:15 +03:00
التزام 8bde42182e
20 ملفات معدلة مع 4613 إضافات و0 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

343
q4-siem-system/dashboard/app.js Normal file
عرض الملف

@@ -0,0 +1,343 @@
/**
* SIEM Dashboard - JavaScript
* نظام مراقبة وتحليل السجلات الأمنية
*/
// ═══════════════════════════════════════════════════════════════
// بيانات تجريبية (في الإنتاج تأتي من API)
// ═══════════════════════════════════════════════════════════════
const sampleData = {
statistics: {
total_lines: 1250,
threats_detected: 15,
sources_analyzed: 3
},
summary: {
total_alerts: 15,
critical: 5,
high: 6,
medium: 4,
suspicious_ips_count: 4
},
alerts: [
{
id: "a1b2c3d4",
timestamp: "2026-07-26T14:05:01",
threat_type: "brute_force",
description: "محاولات تسجيل دخول فاشلة متكررة",
severity: "critical",
source_ip: "192.168.1.100",
details: { path: "/api/login", attempts: 15 }
},
{
id: "e5f6g7h8",
timestamp: "2026-07-26T14:10:02",
threat_type: "sql_injection",
description: "محاولة SQL Injection",
severity: "critical",
source_ip: "10.0.0.50",
details: { path: "/api/users?id=1' OR '1'='1" }
},
{
id: "i9j0k1l2",
timestamp: "2026-07-26T14:15:01",
threat_type: "xss_attempt",
description: "محاولة XSS",
severity: "high",
source_ip: "172.16.0.25",
details: { path: "/page?q=<script>alert('xss')</script>" }
},
{
id: "m3n4o5p6",
timestamp: "2026-07-26T14:15:02",
threat_type: "path_traversal",
description: "محاولة Path Traversal",
severity: "high",
source_ip: "172.16.0.25",
details: { path: "/../../etc/passwd" }
},
{
id: "q7r8s9t0",
timestamp: "2026-07-26T14:00:05",
threat_type: "ssh_brute_force",
description: "محاولات SSH فاشلة",
severity: "critical",
source_ip: "192.168.1.200",
details: { attempts: 5, usernames: ["admin", "root", "test"] }
},
{
id: "u1v2w3x4",
timestamp: "2026-07-26T14:10:01",
threat_type: "suspicious_user_agent",
description: "User-Agent مشبوه",
severity: "medium",
source_ip: "10.0.0.50",
details: { user_agent: "sqlmap/1.5" }
}
],
suspicious_ips: [
{
ip: "192.168.1.100",
threat_count: 15,
request_count: 120,
threats: ["brute_force", "auth_failure"],
last_seen: "2026-07-26T14:05:06"
},
{
ip: "10.0.0.50",
threat_count: 8,
request_count: 45,
threats: ["sql_injection", "suspicious_user_agent"],
last_seen: "2026-07-26T14:10:02"
},
{
ip: "172.16.0.25",
threat_count: 5,
request_count: 30,
threats: ["xss_attempt", "path_traversal"],
last_seen: "2026-07-26T14:15:02"
},
{
ip: "192.168.1.200",
threat_count: 5,
request_count: 25,
threats: ["ssh_brute_force"],
last_seen: "2026-07-26T14:00:05"
}
],
threat_counts: {
"SQL Injection": 3,
"Brute Force": 5,
"XSS": 2,
"Path Traversal": 2,
"SSH Attacks": 3
},
source_lines: {
nginx: 850,
auth: 200,
app: 200
}
};
// ═══════════════════════════════════════════════════════════════
// تحديث الإحصائيات
// ═══════════════════════════════════════════════════════════════
function updateStats(data) {
document.getElementById('criticalCount').textContent = data.summary.critical;
document.getElementById('highCount').textContent = data.summary.high;
document.getElementById('mediumCount').textContent = data.summary.medium;
document.getElementById('suspiciousIPs').textContent = data.summary.suspicious_ips_count;
// تحديث عدد الأسطر لكل مصدر
document.getElementById('nginxLines').textContent = data.source_lines.nginx.toLocaleString();
document.getElementById('authLines').textContent = data.source_lines.auth.toLocaleString();
document.getElementById('appLines').textContent = data.source_lines.app.toLocaleString();
}
// ═══════════════════════════════════════════════════════════════
// عرض التنبيهات
// ═══════════════════════════════════════════════════════════════
function renderAlerts(alerts, filter = 'all') {
const container = document.getElementById('alertsList');
container.innerHTML = '';
const filteredAlerts = filter === 'all'
? alerts
: alerts.filter(a => a.severity === filter);
if (filteredAlerts.length === 0) {
container.innerHTML = '<p style="text-align: center; color: var(--text-secondary); padding: 40px;">لا توجد تنبيهات</p>';
return;
}
filteredAlerts.forEach(alert => {
const icon = getAlertIcon(alert.severity);
const time = formatTime(alert.timestamp);
const alertHtml = `
<div class="alert-item ${alert.severity}">
<div class="alert-icon">${icon}</div>
<div class="alert-content">
<div class="alert-title">${alert.description}</div>
<div class="alert-details">
<strong>IP:</strong> ${alert.source_ip} |
<strong>النوع:</strong> ${alert.threat_type}
</div>
<div class="alert-time">${time}</div>
</div>
<span class="severity-badge ${alert.severity}">${getSeverityLabel(alert.severity)}</span>
</div>
`;
container.innerHTML += alertHtml;
});
}
function getAlertIcon(severity) {
const icons = {
critical: '🚨',
high: '⚠️',
medium: '📊',
low: 'ℹ️'
};
return icons[severity] || '📋';
}
function getSeverityLabel(severity) {
const labels = {
critical: 'حرج',
high: 'عالي',
medium: 'متوسط',
low: 'منخفض'
};
return labels[severity] || severity;
}
function formatTime(timestamp) {
const date = new Date(timestamp);
return date.toLocaleString('ar-SA', {
year: 'numeric',
month: 'short',
day: 'numeric',
hour: '2-digit',
minute: '2-digit'
});
}
// ═══════════════════════════════════════════════════════════════
// عرض عناوين IP المشبوهة
// ═══════════════════════════════════════════════════════════════
function renderSuspiciousIPs(ips) {
const tbody = document.getElementById('ipsTableBody');
tbody.innerHTML = '';
ips.forEach(ip => {
const row = `
<tr>
<td><span class="ip-address">${ip.ip}</span></td>
<td><span class="threat-count">${ip.threat_count}</span></td>
<td>${ip.request_count}</td>
<td>${formatTime(ip.last_seen)}</td>
<td><button class="btn-block" onclick="blockIP('${ip.ip}')">حظر</button></td>
</tr>
`;
tbody.innerHTML += row;
});
}
function blockIP(ip) {
if (confirm(`هل تريد حظر عنوان IP: ${ip}؟`)) {
alert(`تم إرسال طلب حظر ${ip} إلى الخادم`);
// في الإنتاج: إرسال طلب API لحظر IP
}
}
// ═══════════════════════════════════════════════════════════════
// عرض الرسم البياني
// ═══════════════════════════════════════════════════════════════
function renderChart(threatCounts) {
const container = document.getElementById('threatChart');
container.innerHTML = '';
const maxCount = Math.max(...Object.values(threatCounts));
const colors = ['sql', 'brute', 'xss', 'traversal', 'sql'];
let colorIndex = 0;
for (const [threat, count] of Object.entries(threatCounts)) {
const percentage = (count / maxCount) * 100;
const color = colors[colorIndex % colors.length];
const barHtml = `
<div class="chart-bar">
<span class="chart-label">${threat}</span>
<div class="chart-bar-container">
<div class="chart-bar-fill ${color}" style="width: ${percentage}%">
${count}
</div>
</div>
</div>
`;
container.innerHTML += barHtml;
colorIndex++;
}
}
// ═══════════════════════════════════════════════════════════════
// تصفية التنبيهات
// ═══════════════════════════════════════════════════════════════
function setupFilters() {
const filterButtons = document.querySelectorAll('.filter-btn');
filterButtons.forEach(btn => {
btn.addEventListener('click', () => {
// إزالة active من جميع الأزرار
filterButtons.forEach(b => b.classList.remove('active'));
// إضافة active للزر المضغوط
btn.classList.add('active');
// تصفية التنبيهات
const filter = btn.dataset.filter;
renderAlerts(sampleData.alerts, filter);
});
});
}
// ═══════════════════════════════════════════════════════════════
// تحديث الوقت
// ═══════════════════════════════════════════════════════════════
function updateTime() {
const now = new Date();
const timeStr = now.toLocaleTimeString('ar-SA');
document.getElementById('lastUpdate').textContent = timeStr;
}
// ═══════════════════════════════════════════════════════════════
// جلب البيانات من API (للإنتاج)
// ═══════════════════════════════════════════════════════════════
async function fetchData() {
try {
// في الإنتاج: استبدل بـ API حقيقي
// const response = await fetch('/api/siem/report');
// const data = await response.json();
// استخدام البيانات التجريبية
return sampleData;
} catch (error) {
console.error('خطأ في جلب البيانات:', error);
return sampleData;
}
}
// ═══════════════════════════════════════════════════════════════
// التهيئة
// ═══════════════════════════════════════════════════════════════
async function init() {
const data = await fetchData();
updateStats(data);
renderAlerts(data.alerts);
renderSuspiciousIPs(data.suspicious_ips);
renderChart(data.threat_counts);
setupFilters();
updateTime();
// تحديث الوقت كل ثانية
setInterval(updateTime, 1000);
// تحديث البيانات كل 30 ثانية
setInterval(async () => {
const newData = await fetchData();
updateStats(newData);
// يمكن إضافة تحديث للتنبيهات أيضاً
}, 30000);
}
// بدء التطبيق
document.addEventListener('DOMContentLoaded', init);

145
q4-siem-system/dashboard/index.html Normal file
عرض الملف

@@ -0,0 +1,145 @@
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SIEM Dashboard - لوحة تحكم الأمان</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<!-- Header -->
<header class="header">
<div class="header-content">
<h1>🛡️ SIEM Dashboard</h1>
<p>نظام مراقبة وتحليل السجلات الأمنية</p>
</div>
<div class="header-actions">
<span class="status-badge online">● متصل</span>
<span class="last-update">آخر تحديث: <span id="lastUpdate">--:--:--</span></span>
</div>
</header>
<!-- Stats Cards -->
<section class="stats-grid">
<div class="stat-card critical">
<div class="stat-icon">🚨</div>
<div class="stat-content">
<h3>تنبيهات حرجة</h3>
<p class="stat-number" id="criticalCount">0</p>
</div>
</div>
<div class="stat-card high">
<div class="stat-icon">⚠️</div>
<div class="stat-content">
<h3>تنبيهات عالية</h3>
<p class="stat-number" id="highCount">0</p>
</div>
</div>
<div class="stat-card medium">
<div class="stat-icon">📊</div>
<div class="stat-content">
<h3>تنبيهات متوسطة</h3>
<p class="stat-number" id="mediumCount">0</p>
</div>
</div>
<div class="stat-card info">
<div class="stat-icon">🔍</div>
<div class="stat-content">
<h3>IPs مشبوهة</h3>
<p class="stat-number" id="suspiciousIPs">0</p>
</div>
</div>
</section>
<!-- Main Content -->
<div class="main-content">
<!-- Alerts Section -->
<section class="alerts-section">
<div class="section-header">
<h2>📋 التنبيهات الأخيرة</h2>
<div class="filter-buttons">
<button class="filter-btn active" data-filter="all">الكل</button>
<button class="filter-btn" data-filter="critical">حرجة</button>
<button class="filter-btn" data-filter="high">عالية</button>
<button class="filter-btn" data-filter="medium">متوسطة</button>
</div>
</div>
<div class="alerts-list" id="alertsList">
<!-- Alerts will be inserted here -->
</div>
</section>
<!-- Suspicious IPs Section -->
<section class="ips-section">
<div class="section-header">
<h2>🔴 عناوين IP المشبوهة</h2>
</div>
<div class="ips-table-container">
<table class="ips-table">
<thead>
<tr>
<th>عنوان IP</th>
<th>عدد التهديدات</th>
<th>عدد الطلبات</th>
<th>آخر نشاط</th>
<th>الإجراء</th>
</tr>
</thead>
<tbody id="ipsTableBody">
<!-- IPs will be inserted here -->
</tbody>
</table>
</div>
</section>
</div>
<!-- Threat Types Chart -->
<section class="chart-section">
<div class="section-header">
<h2>📈 أنواع التهديدات</h2>
</div>
<div class="chart-container">
<div class="bar-chart" id="threatChart">
<!-- Chart bars will be inserted here -->
</div>
</div>
</section>
<!-- Log Sources Status -->
<section class="sources-section">
<div class="section-header">
<h2>📂 حالة مصادر السجلات</h2>
</div>
<div class="sources-grid">
<div class="source-card active">
<div class="source-icon">🌐</div>
<h4>Nginx Logs</h4>
<p class="source-status">● نشط</p>
<p class="source-lines"><span id="nginxLines">0</span> سطر</p>
</div>
<div class="source-card active">
<div class="source-icon">🔐</div>
<h4>Auth Logs</h4>
<p class="source-status">● نشط</p>
<p class="source-lines"><span id="authLines">0</span> سطر</p>
</div>
<div class="source-card active">
<div class="source-icon">📱</div>
<h4>App Logs</h4>
<p class="source-status">● نشط</p>
<p class="source-lines"><span id="appLines">0</span> سطر</p>
</div>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<p>SIEM Dashboard - نظام مراقبة أمني لمنصة غيمة</p>
<p>© 2026 - جميع الحقوق محفوظة</p>
</footer>
</div>
<script src="app.js"></script>
</body>
</html>

498
q4-siem-system/dashboard/styles.css Normal file
عرض الملف

@@ -0,0 +1,498 @@
/* ═══════════════════════════════════════════════════════════════
SIEM Dashboard - Styles
نظام مراقبة وتحليل السجلات الأمنية
═══════════════════════════════════════════════════════════════ */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--bg-primary: #0f172a;
--bg-secondary: #1e293b;
--bg-card: #334155;
--text-primary: #f8fafc;
--text-secondary: #94a3b8;
--accent-blue: #3b82f6;
--accent-green: #22c55e;
--accent-yellow: #eab308;
--accent-red: #ef4444;
--accent-orange: #f97316;
--border-color: #475569;
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: var(--bg-primary);
color: var(--text-primary);
min-height: 100vh;
line-height: 1.6;
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 20px;
}
/* ═══════════════════════════════════════════════════════════════
Header
═══════════════════════════════════════════════════════════════ */
.header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 30px;
background: var(--bg-secondary);
border-radius: 12px;
margin-bottom: 24px;
box-shadow: var(--shadow);
}
.header h1 {
font-size: 1.8rem;
margin-bottom: 4px;
}
.header p {
color: var(--text-secondary);
font-size: 0.9rem;
}
.header-actions {
display: flex;
align-items: center;
gap: 20px;
}
.status-badge {
padding: 6px 12px;
border-radius: 20px;
font-size: 0.85rem;
font-weight: 500;
}
.status-badge.online {
background: rgba(34, 197, 94, 0.2);
color: var(--accent-green);
}
.last-update {
color: var(--text-secondary);
font-size: 0.85rem;
}
/* ═══════════════════════════════════════════════════════════════
Stats Cards
═══════════════════════════════════════════════════════════════ */
.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
gap: 20px;
margin-bottom: 24px;
}
.stat-card {
display: flex;
align-items: center;
gap: 16px;
padding: 24px;
background: var(--bg-secondary);
border-radius: 12px;
border-right: 4px solid;
box-shadow: var(--shadow);
transition: transform 0.2s;
}
.stat-card:hover {
transform: translateY(-2px);
}
.stat-card.critical {
border-color: var(--accent-red);
}
.stat-card.high {
border-color: var(--accent-orange);
}
.stat-card.medium {
border-color: var(--accent-yellow);
}
.stat-card.info {
border-color: var(--accent-blue);
}
.stat-icon {
font-size: 2.5rem;
}
.stat-content h3 {
font-size: 0.9rem;
color: var(--text-secondary);
margin-bottom: 4px;
}
.stat-number {
font-size: 2rem;
font-weight: 700;
}
.stat-card.critical .stat-number { color: var(--accent-red); }
.stat-card.high .stat-number { color: var(--accent-orange); }
.stat-card.medium .stat-number { color: var(--accent-yellow); }
.stat-card.info .stat-number { color: var(--accent-blue); }
/* ═══════════════════════════════════════════════════════════════
Main Content
═══════════════════════════════════════════════════════════════ */
.main-content {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 24px;
margin-bottom: 24px;
}
@media (max-width: 1024px) {
.main-content {
grid-template-columns: 1fr;
}
}
.section-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
}
.section-header h2 {
font-size: 1.2rem;
}
/* ═══════════════════════════════════════════════════════════════
Alerts Section
═══════════════════════════════════════════════════════════════ */
.alerts-section {
background: var(--bg-secondary);
border-radius: 12px;
padding: 24px;
box-shadow: var(--shadow);
}
.filter-buttons {
display: flex;
gap: 8px;
}
.filter-btn {
padding: 6px 14px;
border: 1px solid var(--border-color);
background: transparent;
color: var(--text-secondary);
border-radius: 6px;
cursor: pointer;
font-size: 0.85rem;
transition: all 0.2s;
}
.filter-btn:hover,
.filter-btn.active {
background: var(--accent-blue);
border-color: var(--accent-blue);
color: white;
}
.alerts-list {
max-height: 400px;
overflow-y: auto;
}
.alert-item {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 16px;
background: var(--bg-card);
border-radius: 8px;
margin-bottom: 12px;
border-right: 3px solid;
}
.alert-item.critical { border-color: var(--accent-red); }
.alert-item.high { border-color: var(--accent-orange); }
.alert-item.medium { border-color: var(--accent-yellow); }
.alert-icon {
font-size: 1.5rem;
}
.alert-content {
flex: 1;
}
.alert-title {
font-weight: 600;
margin-bottom: 4px;
}
.alert-details {
font-size: 0.85rem;
color: var(--text-secondary);
}
.alert-time {
font-size: 0.75rem;
color: var(--text-secondary);
}
.severity-badge {
padding: 4px 10px;
border-radius: 4px;
font-size: 0.75rem;
font-weight: 600;
text-transform: uppercase;
}
.severity-badge.critical {
background: rgba(239, 68, 68, 0.2);
color: var(--accent-red);
}
.severity-badge.high {
background: rgba(249, 115, 22, 0.2);
color: var(--accent-orange);
}
.severity-badge.medium {
background: rgba(234, 179, 8, 0.2);
color: var(--accent-yellow);
}
/* ═══════════════════════════════════════════════════════════════
IPs Section
═══════════════════════════════════════════════════════════════ */
.ips-section {
background: var(--bg-secondary);
border-radius: 12px;
padding: 24px;
box-shadow: var(--shadow);
}
.ips-table-container {
overflow-x: auto;
}
.ips-table {
width: 100%;
border-collapse: collapse;
}
.ips-table th,
.ips-table td {
padding: 12px;
text-align: right;
border-bottom: 1px solid var(--border-color);
}
.ips-table th {
color: var(--text-secondary);
font-weight: 500;
font-size: 0.85rem;
}
.ips-table td {
font-size: 0.9rem;
}
.ips-table tr:hover {
background: var(--bg-card);
}
.ip-address {
font-family: monospace;
color: var(--accent-red);
}
.threat-count {
display: inline-block;
padding: 4px 10px;
background: rgba(239, 68, 68, 0.2);
color: var(--accent-red);
border-radius: 4px;
font-weight: 600;
}
.btn-block {
padding: 6px 12px;
background: var(--accent-red);
color: white;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 0.8rem;
transition: opacity 0.2s;
}
.btn-block:hover {
opacity: 0.8;
}
/* ═══════════════════════════════════════════════════════════════
Chart Section
═══════════════════════════════════════════════════════════════ */
.chart-section {
background: var(--bg-secondary);
border-radius: 12px;
padding: 24px;
margin-bottom: 24px;
box-shadow: var(--shadow);
}
.chart-container {
padding: 20px 0;
}
.bar-chart {
display: flex;
flex-direction: column;
gap: 16px;
}
.chart-bar {
display: flex;
align-items: center;
gap: 12px;
}
.chart-label {
width: 150px;
font-size: 0.9rem;
text-align: left;
}
.chart-bar-container {
flex: 1;
height: 30px;
background: var(--bg-card);
border-radius: 4px;
overflow: hidden;
}
.chart-bar-fill {
height: 100%;
border-radius: 4px;
transition: width 0.5s ease;
display: flex;
align-items: center;
justify-content: flex-end;
padding-right: 10px;
font-size: 0.85rem;
font-weight: 600;
}
.chart-bar-fill.sql { background: var(--accent-red); }
.chart-bar-fill.xss { background: var(--accent-orange); }
.chart-bar-fill.brute { background: var(--accent-yellow); }
.chart-bar-fill.traversal { background: var(--accent-blue); }
/* ═══════════════════════════════════════════════════════════════
Sources Section
═══════════════════════════════════════════════════════════════ */
.sources-section {
background: var(--bg-secondary);
border-radius: 12px;
padding: 24px;
margin-bottom: 24px;
box-shadow: var(--shadow);
}
.sources-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 16px;
}
.source-card {
background: var(--bg-card);
border-radius: 8px;
padding: 20px;
text-align: center;
}
.source-icon {
font-size: 2rem;
margin-bottom: 8px;
}
.source-card h4 {
margin-bottom: 8px;
}
.source-status {
font-size: 0.85rem;
color: var(--accent-green);
margin-bottom: 4px;
}
.source-lines {
font-size: 0.9rem;
color: var(--text-secondary);
}
/* ═══════════════════════════════════════════════════════════════
Footer
═══════════════════════════════════════════════════════════════ */
.footer {
text-align: center;
padding: 24px;
color: var(--text-secondary);
font-size: 0.85rem;
}
/* ═══════════════════════════════════════════════════════════════
Scrollbar
═══════════════════════════════════════════════════════════════ */
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: var(--bg-card);
border-radius: 4px;
}
::-webkit-scrollbar-thumb {
background: var(--border-color);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: var(--text-secondary);
}
/* ═══════════════════════════════════════════════════════════════
Animations
═══════════════════════════════════════════════════════════════ */
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
.alert-item.new {
animation: pulse 1s ease-in-out 3;
}