Hugging Face's logo

Spaces:
capta1n
/
bas2
Running

App Files Community
capta1n commited on
Commit
a8a67f4
·
verified ·
1 Parent(s): 04dc9e9

Add 2 files

Browse files
Files changed (2) hide show
  1. index.html +177 -97
  2. prompts.txt +2 -1
index.html CHANGED
@@ -1,17 +1,18 @@
1
  <!DOCTYPE html>
2
- <html lang="en">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Phishing Attack Kill Chain Visualization</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
  <style>
10
  .attack-node {
11
  transition: all 0.3s ease;
12
- cursor: pointer;
13
  z-index: 2;
14
  position: absolute;
 
15
  }
16
  .attack-node:hover {
17
  transform: scale(1.05);
@@ -90,31 +91,48 @@
90
  transform: rotate(45deg);
91
  z-index: 1;
92
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
93
  </style>
94
  </head>
95
  <body class="bg-gray-100">
96
  <div class="container mx-auto px-4 py-8">
97
- <h1 class="text-3xl font-bold text-center text-gray-800 mb-2">Phishing Attack Kill Chain Visualization</h1>
98
- <p class="text-center text-gray-600 mb-8">Sequential attack flow from initial compromise to data exfiltration</p>
99
 
100
- <!-- Zoom Controls -->
101
  <div class="flex justify-center mb-4 space-x-2">
102
  <button id="zoom-in" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
103
- <i class="fas fa-search-plus"></i> Zoom In
104
  </button>
105
  <button id="zoom-out" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
106
- <i class="fas fa-search-minus"></i> Zoom Out
107
  </button>
108
  <button id="zoom-reset" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
109
- <i class="fas fa-expand"></i> Reset
110
  </button>
111
  </div>
112
 
113
- <!-- Main Visualization Container -->
114
  <div class="relative bg-white rounded-xl shadow-lg p-6 overflow-hidden border border-gray-200">
115
- <!-- Zoomable Container -->
116
  <div id="zoom-container" class="zoom-container origin-center">
117
- <!-- Background Grid -->
118
  <div class="absolute inset-0 opacity-20">
119
  <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
120
  <defs>
@@ -126,135 +144,135 @@
126
  </svg>
127
  </div>
128
 
129
- <!-- Attack Flow Container -->
130
- <div class="attack-flow">
131
- <!-- Attack Flow SVG -->
132
  <svg class="absolute inset-0 w-full h-full" id="attack-flow"></svg>
133
 
134
- <!-- Attack Nodes - Sequential Layout -->
135
- <div id="attacker" class="attack-node bg-red-50 p-3 rounded-lg shadow-sm border-2 border-red-300 w-[140px] text-center" style="left: 5%; top: 50%;">
136
  <div class="node-icon bg-red-100">
137
  <i class="fas fa-user-secret text-red-600 text-lg"></i>
138
  </div>
139
- <h3 class="font-bold text-red-800 text-sm">Attacker</h3>
140
  <p class="text-xs text-red-600 mt-1">C2: 185.143.223.47</p>
141
  </div>
142
 
143
- <!-- Step 1: Phishing Email -->
144
- <div id="step1" class="attack-node bg-blue-50 p-3 rounded-lg shadow-sm border-2 border-blue-300 w-[140px] text-center" style="left: 20%; top: 20%;">
145
  <div class="sequence-number">1</div>
146
  <div class="node-icon bg-blue-100">
147
  <i class="fas fa-envelope text-blue-600 text-lg"></i>
148
  </div>
149
- <h3 class="font-bold text-blue-800 text-sm">Phishing Email</h3>
150
  <p class="text-xs text-blue-600 mt-1">"拥抱AI变革"通知</p>
151
  </div>
152
 
153
- <!-- Step 2: Malware Execution -->
154
- <div id="step2" class="attack-node bg-red-50 p-3 rounded-lg shadow-sm border-2 border-red-300 w-[140px] text-center" style="left: 35%; top: 35%;">
155
  <div class="sequence-number">2</div>
156
  <div class="node-icon bg-red-100">
157
  <i class="fas fa-bug text-red-600 text-lg"></i>
158
  </div>
159
- <h3 class="font-bold text-red-800 text-sm">Malware Execution</h3>
160
  <p class="text-xs text-red-600 mt-1">Cobalt Strike DLL</p>
161
  </div>
162
 
163
- <!-- Step 3: C2 Communication -->
164
- <div id="step3" class="attack-node bg-purple-50 p-3 rounded-lg shadow-sm border-2 border-purple-300 w-[140px] text-center" style="left: 50%; top: 20%;">
165
  <div class="sequence-number">3</div>
166
  <div class="node-icon bg-purple-100">
167
  <i class="fas fa-network-wired text-purple-600 text-lg"></i>
168
  </div>
169
- <h3 class="font-bold text-purple-800 text-sm">C2 Channel</h3>
170
  <p class="text-xs text-purple-600 mt-1">api.cloudfront[.]com</p>
171
  </div>
172
 
173
- <!-- Step 4: Credential Theft -->
174
- <div id="step4" class="attack-node bg-yellow-50 p-3 rounded-lg shadow-sm border-2 border-yellow-300 w-[140px] text-center" style="left: 65%; top: 35%;">
175
  <div class="sequence-number">4</div>
176
  <div class="node-icon bg-yellow-100">
177
  <i class="fas fa-key text-yellow-600 text-lg"></i>
178
  </div>
179
- <h3 class="font-bold text-yellow-800 text-sm">Credential Theft</h3>
180
  <p class="text-xs text-yellow-600 mt-1">Mimikatz + Chrome</p>
181
  </div>
182
 
183
- <!-- Step 5: Cloud Docs Penetration -->
184
- <div id="step5" class="attack-node bg-green-50 p-3 rounded-lg shadow-sm border-2 border-green-300 w-[140px] text-center" style="left: 80%; top: 20%;">
185
  <div class="sequence-number">5</div>
186
  <div class="node-icon bg-green-100">
187
  <i class="fas fa-cloud text-green-600 text-lg"></i>
188
  </div>
189
- <h3 class="font-bold text-green-800 text-sm">Cloud Docs Access</h3>
190
  <p class="text-xs text-green-600 mt-1">语雀API Token</p>
191
  </div>
192
 
193
- <!-- Step 6: Production Intrusion -->
194
- <div id="step6" class="attack-node bg-indigo-50 p-3 rounded-lg shadow-sm border-2 border-indigo-300 w-[140px] text-center" style="left: 35%; top: 65%;">
195
  <div class="sequence-number">6</div>
196
  <div class="node-icon bg-indigo-100">
197
  <i class="fas fa-server text-indigo-600 text-lg"></i>
198
  </div>
199
- <h3 class="font-bold text-indigo-800 text-sm">DB Server Access</h3>
200
  <p class="text-xs text-indigo-600 mt-1">10.8.8.88</p>
201
  </div>
202
 
203
- <!-- Step 7: Data Exfiltration -->
204
- <div id="step7" class="attack-node bg-pink-50 p-3 rounded-lg shadow-sm border-2 border-pink-300 w-[140px] text-center" style="left: 50%; top: 80%;">
205
  <div class="sequence-number">7</div>
206
  <div class="node-icon bg-pink-100">
207
  <i class="fas fa-file-export text-pink-600 text-lg"></i>
208
  </div>
209
- <h3 class="font-bold text-pink-800 text-sm">Data Exfiltration</h3>
210
  <p class="text-xs text-pink-600 mt-1">DNS隧道传输</p>
211
  </div>
212
 
213
- <!-- Final C2 Connection -->
214
- <div id="final-c2" class="attack-node bg-red-50 p-3 rounded-lg shadow-sm border-2 border-red-300 w-[140px] text-center" style="left: 80%; top: 65%;">
215
  <div class="node-icon bg-red-100">
216
  <i class="fas fa-exchange-alt text-red-600 text-lg"></i>
217
  </div>
218
- <h3 class="font-bold text-red-800 text-sm">C2 Connection</h3>
219
- <p class="text-xs text-red-600 mt-1">Data Exfil Complete</p>
220
  </div>
221
  </div>
222
  </div>
223
 
224
- <!-- Sidebar for Attack Details -->
225
  <div id="attack-sidebar" class="sidebar absolute top-0 right-0 w-96 h-full bg-white shadow-lg p-6 overflow-y-auto">
226
  <button id="close-sidebar" class="absolute top-4 left-4 text-gray-500 hover:text-gray-700">
227
  <i class="fas fa-times"></i>
228
  </button>
229
  <div id="attack-details">
230
- <h2 class="text-xl font-bold text-gray-800 mb-4" id="step-title">Attack Step Details</h2>
231
  <div class="mb-6">
232
- <h3 class="font-medium text-gray-700 mb-2">Attack Behavior</h3>
233
- <div class="bg-gray-50 p-4 rounded-md" id="step-behavior">
234
- <p class="text-sm text-gray-600">Select an attack node to view details</p>
235
  </div>
236
  </div>
237
  <div class="mb-6">
238
- <h3 class="font-medium text-gray-700 mb-2">Triggered Security Products</h3>
239
- <div class="bg-gray-50 p-4 rounded-md" id="step-products">
240
- <p class="text-sm text-gray-600">No product selected</p>
241
  </div>
242
  </div>
243
  <div>
244
- <h3 class="font-medium text-gray-700 mb-2">Alert Information</h3>
245
- <div class="bg-gray-50 p-4 rounded-md" id="step-alerts">
246
- <p class="text-sm text-gray-600">No alerts to display</p>
247
  </div>
248
  </div>
249
  </div>
250
  </div>
251
  </div>
252
 
253
- <!-- Attack Timeline with Alerts -->
254
  <div class="mt-8 bg-white rounded-lg shadow-md p-6">
255
- <h2 class="text-xl font-bold text-gray-800 mb-4">Attack Timeline & Security Alerts</h2>
256
  <div class="space-y-4">
257
- <!-- Step 1 Alert -->
258
  <div class="alert-item bg-blue-50 border-blue-500 p-4 rounded cursor-pointer" data-step="1">
259
  <div class="flex items-start">
260
  <div class="bg-blue-500 text-white p-2 rounded-full mr-3">
@@ -262,7 +280,7 @@
262
  </div>
263
  <div class="flex-1">
264
  <div class="flex justify-between items-start">
265
- <h3 class="font-medium text-blue-800">Phishing Email Detected</h3>
266
  <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">邮件安全网关</span>
267
  </div>
268
  <p class="text-sm text-gray-600 mt-1">[严重] 检测到仿冒发件人邮件 | 发件人: itsupport@fakecompany[.]com → 目标: victim@corp.com</p>
@@ -270,7 +288,7 @@
270
  </div>
271
  </div>
272
 
273
- <!-- Step 2 Alert -->
274
  <div class="alert-item bg-red-50 border-red-500 p-4 rounded cursor-pointer" data-step="2">
275
  <div class="flex items-start">
276
  <div class="bg-red-500 text-white p-2 rounded-full mr-3">
@@ -278,7 +296,7 @@
278
  </div>
279
  <div class="flex-1">
280
  <div class="flex justify-between items-start">
281
- <h3 class="font-medium text-red-800">Malicious Process Injection</h3>
282
  <span class="bg-red-100 text-red-800 text-xs px-2 py-1 rounded">终端检测与响应 (EDR)</span>
283
  </div>
284
  <p class="text-sm text-gray-600 mt-1">[高危] 可疑进程注入行为 | 进程: C:\Windows\System32\explorer.exe → 加载内存模块: a09xdf.dll</p>
@@ -286,7 +304,7 @@
286
  </div>
287
  </div>
288
 
289
- <!-- Step 3 Alert -->
290
  <div class="alert-item bg-purple-50 border-purple-500 p-4 rounded cursor-pointer" data-step="3">
291
  <div class="flex items-start">
292
  <div class="bg-purple-500 text-white p-2 rounded-full mr-3">
@@ -294,7 +312,7 @@
294
  </div>
295
  <div class="flex-1">
296
  <div class="flex justify-between items-start">
297
- <h3 class="font-medium text-purple-800">Suspicious C2 Communication</h3>
298
  <span class="bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded">网络流量分析 (NTA)</span>
299
  </div>
300
  <p class="text-sm text-gray-600 mt-1">[紧急] 异常外联行为 | 目标IP: 54.231.1.1（归属AWS新加坡） | 协议: HTTPS</p>
@@ -302,7 +320,7 @@
302
  </div>
303
  </div>
304
 
305
- <!-- Step 4 Alert -->
306
  <div class="alert-item bg-yellow-50 border-yellow-500 p-4 rounded cursor-pointer" data-step="4">
307
  <div class="flex items-start">
308
  <div class="bg-yellow-500 text-white p-2 rounded-full mr-3">
@@ -310,7 +328,7 @@
310
  </div>
311
  <div class="flex-1">
312
  <div class="flex justify-between items-start">
313
- <h3 class="font-medium text-yellow-800">Credential Theft Detected</h3>
314
  <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded">身份认证异常检测 (UEBA)</span>
315
  </div>
316
  <p class="text-sm text-gray-600 mt-1">[高危] 异常浏览器会话 | 用户: Victim_Account | IP来源: 172.16.1.23 → 登录设备指纹突变</p>
@@ -318,7 +336,7 @@
318
  </div>
319
  </div>
320
 
321
- <!-- Step 5 Alert -->
322
  <div class="alert-item bg-green-50 border-green-500 p-4 rounded cursor-pointer" data-step="5">
323
  <div class="flex items-start">
324
  <div class="bg-green-500 text-white p-2 rounded-full mr-3">
@@ -326,7 +344,7 @@
326
  </div>
327
  <div class="flex-1">
328
  <div class="flex justify-between items-start">
329
- <h3 class="font-medium text-green-800">Sensitive Data Access</h3>
330
  <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded">DLP (数据防泄漏)</span>
331
  </div>
332
  <p class="text-sm text-gray-600 mt-1">[严重] 敏感数据访问行为 | 用户: Victim_Account | 操作: 下载文档ID: YUQUE-1234</p>
@@ -334,7 +352,7 @@
334
  </div>
335
  </div>
336
 
337
- <!-- Step 6 Alert -->
338
  <div class="alert-item bg-indigo-50 border-indigo-500 p-4 rounded cursor-pointer" data-step="6">
339
  <div class="flex items-start">
340
  <div class="bg-indigo-500 text-white p-2 rounded-full mr-3">
@@ -342,7 +360,7 @@
342
  </div>
343
  <div class="flex-1">
344
  <div class="flex justify-between items-start">
345
- <h3 class="font-medium text-indigo-800">Database Server Intrusion</h3>
346
  <span class="bg-indigo-100 text-indigo-800 text-xs px-2 py-1 rounded">HIDS (主机入侵检测)</span>
347
  </div>
348
  <p class="text-sm text-gray-600 mt-1">[紧急] 非常规时间SSH登录 | 账号: dba_admin | 来源IP: 10.8.8.12 | 操作: 执行SHOW DATABASES</p>
@@ -350,7 +368,7 @@
350
  </div>
351
  </div>
352
 
353
- <!-- Step 7 Alert -->
354
  <div class="alert-item bg-pink-50 border-pink-500 p-4 rounded cursor-pointer" data-step="7">
355
  <div class="flex items-start">
356
  <div class="bg-pink-500 text-white p-2 rounded-full mr-3">
@@ -358,7 +376,7 @@
358
  </div>
359
  <div class="flex-1">
360
  <div class="flex justify-between items-start">
361
- <h3 class="font-medium text-pink-800">Data Exfiltration Detected</h3>
362
  <span class="bg-pink-100 text-pink-800 text-xs px-2 py-1 rounded">全流量威胁回溯</span>
363
  </div>
364
  <p class="text-sm text-gray-600 mt-1">[严重] 异常数据传输 | 协议: DNS TXT记录 | 目标域: xyz.attacker[.]com | 数据量: 142MB</p>
@@ -370,7 +388,7 @@
370
  </div>
371
 
372
  <script>
373
- // Attack steps data
374
  const attackSteps = {
375
  1: {
376
  title: "钓鱼邮件投递",
@@ -416,7 +434,7 @@
416
  }
417
  };
418
 
419
- // Draw curved lines between nodes with arrows
420
  function drawCurvedLine(svg, fromSelector, toSelector, color = "red", width = 2, animate = false) {
421
  const fromEl = document.querySelector(fromSelector);
422
  const toEl = document.querySelector(toSelector);
@@ -432,7 +450,7 @@
432
  const x2 = toRect.left + toRect.width/2 - svgRect.left;
433
  const y2 = toRect.top + toRect.height/2 - svgRect.top;
434
 
435
- // Calculate control points for a smooth curve
436
  const dx = x2 - x1;
437
  const dy = y2 - y1;
438
  const controlX1 = x1 + dx * 0.5;
@@ -440,7 +458,7 @@
440
  const controlX2 = x1 + dx * 0.5;
441
  const controlY2 = y2;
442
 
443
- // Create path for the line
444
  const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
445
  path.setAttribute("d", `M${x1},${y1} C${controlX1},${controlY1} ${controlX2},${controlY2} ${x2},${y2}`);
446
  path.setAttribute("stroke", color);
@@ -454,7 +472,7 @@
454
 
455
  svg.appendChild(path);
456
 
457
- // Add arrow marker at the end
458
  const marker = document.createElementNS("http://www.w3.org/2000/svg", "marker");
459
  marker.setAttribute("id", `arrow-${color.replace('#', '')}`);
460
  marker.setAttribute("viewBox", "0 0 10 10");
@@ -473,7 +491,7 @@
473
 
474
  path.setAttribute("marker-end", `url(#arrow-${color.replace('#', '')})`);
475
 
476
- // Add sequence number to the line
477
  const pathLength = path.getTotalLength();
478
  const midPoint = path.getPointAtLength(pathLength * 0.5);
479
 
@@ -486,7 +504,7 @@
486
  text.setAttribute("fill", color);
487
  text.setAttribute("font-weight", "bold");
488
 
489
- // Find the sequence number from the target node
490
  const toNode = document.querySelector(toSelector);
491
  if (toNode) {
492
  const seqNumElement = toNode.querySelector('.sequence-number');
@@ -496,9 +514,11 @@
496
  }
497
 
498
  svg.appendChild(text);
 
 
499
  }
500
 
501
- // Show attack details in sidebar
502
  function showAttackDetails(stepId) {
503
  const step = attackSteps[stepId];
504
  if (!step) return;
@@ -508,34 +528,34 @@
508
  document.getElementById("step-products").innerHTML = `<p class="text-sm text-gray-600">${step.products}</p>`;
509
  document.getElementById("step-alerts").innerHTML = `<p class="text-sm text-gray-600">${step.alerts}</p>`;
510
 
511
- // Highlight the selected node
512
  document.querySelectorAll('.attack-node').forEach(node => {
513
  node.classList.remove('critical');
514
  });
515
  document.getElementById(`step${stepId}`).classList.add('critical');
516
 
517
- // Open sidebar
518
  document.getElementById("attack-sidebar").classList.add("open");
519
  }
520
 
521
- // Initialize visualization
522
  function initVisualization() {
523
  const svg = document.getElementById("attack-flow");
524
  svg.innerHTML = "";
525
 
526
- // Draw all attack paths in sequence with different colors
527
- drawCurvedLine(svg, "#attacker", "#step1", "#3b82f6", 2); // Blue
528
- drawCurvedLine(svg, "#step1", "#step2", "#ef4444", 2); // Red
529
- drawCurvedLine(svg, "#step2", "#step3", "#8b5cf6", 2); // Purple
530
- drawCurvedLine(svg, "#step3", "#step4", "#f59e0b", 2); // Yellow
531
- drawCurvedLine(svg, "#step4", "#step5", "#10b981", 2); // Green
532
- drawCurvedLine(svg, "#step5", "#step6", "#6366f1", 2); // Indigo
533
- drawCurvedLine(svg, "#step6", "#step7", "#ec4899", 2); // Pink
534
- drawCurvedLine(svg, "#step7", "#final-c2", "#ef4444", 2); // Red
535
- drawCurvedLine(svg, "#final-c2", "#attacker", "#ef4444", 2, true); // Animated red
536
  }
537
 
538
- // Zoom functionality
539
  let scale = 1;
540
  const zoomContainer = document.getElementById("zoom-container");
541
 
@@ -556,18 +576,68 @@
556
  zoomContainer.style.transform = `scale(${scale})`;
557
  });
558
 
559
- // Initialize
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
560
  document.addEventListener("DOMContentLoaded", () => {
561
  initVisualization();
 
562
 
563
- // Add click handlers to attack nodes
564
  for (let i = 1; i <= 7; i++) {
565
  document.getElementById(`step${i}`).addEventListener("click", () => {
566
  showAttackDetails(i);
567
  });
568
  }
569
 
570
- // Add click handlers to timeline alerts
571
  document.querySelectorAll('.alert-item').forEach(alert => {
572
  alert.addEventListener('click', () => {
573
  const stepId = alert.getAttribute('data-step');
@@ -575,7 +645,7 @@
575
  });
576
  });
577
 
578
- // Close sidebar
579
  document.getElementById("close-sidebar").addEventListener("click", () => {
580
  document.getElementById("attack-sidebar").classList.remove("open");
581
  document.querySelectorAll('.attack-node').forEach(node => {
@@ -583,7 +653,17 @@
583
  });
584
  });
585
 
586
- // Add hover effects to nodes
 
 
 
 
 
 
 
 
 
 
587
  document.querySelectorAll('.attack-node').forEach(node => {
588
  node.addEventListener('mouseenter', () => {
589
  node.classList.add('shadow-md');
 
1
  <!DOCTYPE html>
2
+ <html lang="zh-CN">
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>钓鱼攻击杀伤链可视化</title>
7
  <script src="https://cdn.tailwindcss.com"></script>
8
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
9
  <style>
10
  .attack-node {
11
  transition: all 0.3s ease;
12
+ cursor: move;
13
  z-index: 2;
14
  position: absolute;
15
+ user-select: none;
16
  }
17
  .attack-node:hover {
18
  transform: scale(1.05);
 
91
  transform: rotate(45deg);
92
  z-index: 1;
93
  }
94
+ .behavior-bg {
95
+ background-color: #f0f9ff;
96
+ border-left: 3px solid #3b82f6;
97
+ }
98
+ .products-bg {
99
+ background-color: #f0fdf4;
100
+ border-left: 3px solid #10b981;
101
+ }
102
+ .alerts-bg {
103
+ background-color: #fef2f2;
104
+ border-left: 3px solid #ef4444;
105
+ }
106
+ .attacker-highlight {
107
+ background-color: #fee2e2;
108
+ border: 2px solid #ef4444;
109
+ box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.3);
110
+ }
111
  </style>
112
  </head>
113
  <body class="bg-gray-100">
114
  <div class="container mx-auto px-4 py-8">
115
+ <h1 class="text-3xl font-bold text-center text-gray-800 mb-2">钓鱼攻击杀伤链可视化</h1>
116
+ <p class="text-center text-gray-600 mb-8">从初始入侵到数据外泄的完整攻击流程</p>
117
 
118
+ <!-- 缩放控制 -->
119
  <div class="flex justify-center mb-4 space-x-2">
120
  <button id="zoom-in" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
121
+ <i class="fas fa-search-plus"></i> 放大
122
  </button>
123
  <button id="zoom-out" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
124
+ <i class="fas fa-search-minus"></i> 缩小
125
  </button>
126
  <button id="zoom-reset" class="px-3 py-1 bg-white rounded-md shadow hover:bg-gray-100">
127
+ <i class="fas fa-expand"></i> 重置
128
  </button>
129
  </div>
130
 
131
+ <!-- 主可视化容器 -->
132
  <div class="relative bg-white rounded-xl shadow-lg p-6 overflow-hidden border border-gray-200">
133
+ <!-- 可缩放容器 -->
134
  <div id="zoom-container" class="zoom-container origin-center">
135
+ <!-- 背景网格 -->
136
  <div class="absolute inset-0 opacity-20">
137
  <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
138
  <defs>
 
144
  </svg>
145
  </div>
146
 
147
+ <!-- 攻击流程容器 -->
148
+ <div class="attack-flow" id="flow-container">
149
+ <!-- 攻击流程SVG -->
150
  <svg class="absolute inset-0 w-full h-full" id="attack-flow"></svg>
151
 
152
+ <!-- 攻击节点 - 可拖拽布局 -->
153
+ <div id="attacker" class="attack-node attacker-highlight p-3 rounded-lg shadow-sm w-[160px] text-center" style="left: 5%; top: 50%;">
154
  <div class="node-icon bg-red-100">
155
  <i class="fas fa-user-secret text-red-600 text-lg"></i>
156
  </div>
157
+ <h3 class="font-bold text-red-800 text-sm">BAS AI 黑客</h3>
158
  <p class="text-xs text-red-600 mt-1">C2: 185.143.223.47</p>
159
  </div>
160
 
161
+ <!-- 步骤1: 钓鱼邮件 -->
162
+ <div id="step1" class="attack-node bg-blue-50 p-3 rounded-lg shadow-sm border-2 border-blue-300 w-[160px] text-center" style="left: 25%; top: 15%;">
163
  <div class="sequence-number">1</div>
164
  <div class="node-icon bg-blue-100">
165
  <i class="fas fa-envelope text-blue-600 text-lg"></i>
166
  </div>
167
+ <h3 class="font-bold text-blue-800 text-sm">钓鱼邮件</h3>
168
  <p class="text-xs text-blue-600 mt-1">"拥抱AI变革"通知</p>
169
  </div>
170
 
171
+ <!-- 步骤2: 恶意软件执行 -->
172
+ <div id="step2" class="attack-node bg-red-50 p-3 rounded-lg shadow-sm border-2 border-red-300 w-[160px] text-center" style="left: 45%; top: 30%;">
173
  <div class="sequence-number">2</div>
174
  <div class="node-icon bg-red-100">
175
  <i class="fas fa-bug text-red-600 text-lg"></i>
176
  </div>
177
+ <h3 class="font-bold text-red-800 text-sm">恶意软件执行</h3>
178
  <p class="text-xs text-red-600 mt-1">Cobalt Strike DLL</p>
179
  </div>
180
 
181
+ <!-- 步骤3: C2通信 -->
182
+ <div id="step3" class="attack-node bg-purple-50 p-3 rounded-lg shadow-sm border-2 border-purple-300 w-[160px] text-center" style="left: 25%; top: 45%;">
183
  <div class="sequence-number">3</div>
184
  <div class="node-icon bg-purple-100">
185
  <i class="fas fa-network-wired text-purple-600 text-lg"></i>
186
  </div>
187
+ <h3 class="font-bold text-purple-800 text-sm">C2通道</h3>
188
  <p class="text-xs text-purple-600 mt-1">api.cloudfront[.]com</p>
189
  </div>
190
 
191
+ <!-- 步骤4: 凭据窃取 -->
192
+ <div id="step4" class="attack-node bg-yellow-50 p-3 rounded-lg shadow-sm border-2 border-yellow-300 w-[160px] text-center" style="left: 45%; top: 60%;">
193
  <div class="sequence-number">4</div>
194
  <div class="node-icon bg-yellow-100">
195
  <i class="fas fa-key text-yellow-600 text-lg"></i>
196
  </div>
197
+ <h3 class="font-bold text-yellow-800 text-sm">凭据窃取</h3>
198
  <p class="text-xs text-yellow-600 mt-1">Mimikatz + Chrome</p>
199
  </div>
200
 
201
+ <!-- 步骤5: 云文档渗透 -->
202
+ <div id="step5" class="attack-node bg-green-50 p-3 rounded-lg shadow-sm border-2 border-green-300 w-[160px] text-center" style="left: 65%; top: 30%;">
203
  <div class="sequence-number">5</div>
204
  <div class="node-icon bg-green-100">
205
  <i class="fas fa-cloud text-green-600 text-lg"></i>
206
  </div>
207
+ <h3 class="font-bold text-green-800 text-sm">云文档访问</h3>
208
  <p class="text-xs text-green-600 mt-1">语雀API Token</p>
209
  </div>
210
 
211
+ <!-- 步骤6: 生产环境入侵 -->
212
+ <div id="step6" class="attack-node bg-indigo-50 p-3 rounded-lg shadow-sm border-2 border-indigo-300 w-[160px] text-center" style="left: 65%; top: 60%;">
213
  <div class="sequence-number">6</div>
214
  <div class="node-icon bg-indigo-100">
215
  <i class="fas fa-server text-indigo-600 text-lg"></i>
216
  </div>
217
+ <h3 class="font-bold text-indigo-800 text-sm">数据库服务器访问</h3>
218
  <p class="text-xs text-indigo-600 mt-1">10.8.8.88</p>
219
  </div>
220
 
221
+ <!-- 步骤7: 数据外泄 -->
222
+ <div id="step7" class="attack-node bg-pink-50 p-3 rounded-lg shadow-sm border-2 border-pink-300 w-[160px] text-center" style="left: 85%; top: 45%;">
223
  <div class="sequence-number">7</div>
224
  <div class="node-icon bg-pink-100">
225
  <i class="fas fa-file-export text-pink-600 text-lg"></i>
226
  </div>
227
+ <h3 class="font-bold text-pink-800 text-sm">数据外泄</h3>
228
  <p class="text-xs text-pink-600 mt-1">DNS隧道传输</p>
229
  </div>
230
 
231
+ <!-- 最终C2连接 -->
232
+ <div id="final-c2" class="attack-node bg-red-50 p-3 rounded-lg shadow-sm border-2 border-red-300 w-[160px] text-center" style="left: 85%; top: 15%;">
233
  <div class="node-icon bg-red-100">
234
  <i class="fas fa-exchange-alt text-red-600 text-lg"></i>
235
  </div>
236
+ <h3 class="font-bold text-red-800 text-sm">C2连接</h3>
237
+ <p class="text-xs text-red-600 mt-1">数据外泄完成</p>
238
  </div>
239
  </div>
240
  </div>
241
 
242
+ <!-- 侧边栏 - 攻击详情 -->
243
  <div id="attack-sidebar" class="sidebar absolute top-0 right-0 w-96 h-full bg-white shadow-lg p-6 overflow-y-auto">
244
  <button id="close-sidebar" class="absolute top-4 left-4 text-gray-500 hover:text-gray-700">
245
  <i class="fas fa-times"></i>
246
  </button>
247
  <div id="attack-details">
248
+ <h2 class="text-xl font-bold text-gray-800 mb-4" id="step-title">攻击步骤详情</h2>
249
  <div class="mb-6">
250
+ <h3 class="font-medium text-gray-700 mb-2">攻击行为</h3>
251
+ <div class="p-4 rounded-md behavior-bg" id="step-behavior">
252
+ <p class="text-sm text-gray-600">点击攻击节点查看详情</p>
253
  </div>
254
  </div>
255
  <div class="mb-6">
256
+ <h3 class="font-medium text-gray-700 mb-2">防护产品</h3>
257
+ <div class="p-4 rounded-md products-bg" id="step-products">
258
+ <p class="text-sm text-gray-600">暂无产品信息</p>
259
  </div>
260
  </div>
261
  <div>
262
+ <h3 class="font-medium text-gray-700 mb-2">告警信息</h3>
263
+ <div class="p-4 rounded-md alerts-bg" id="step-alerts">
264
+ <p class="text-sm text-gray-600">暂无告警信息</p>
265
  </div>
266
  </div>
267
  </div>
268
  </div>
269
  </div>
270
 
271
+ <!-- 攻击时间线与安全告警 -->
272
  <div class="mt-8 bg-white rounded-lg shadow-md p-6">
273
+ <h2 class="text-xl font-bold text-gray-800 mb-4">攻击时间线与安全告警</h2>
274
  <div class="space-y-4">
275
+ <!-- 步骤1告警 -->
276
  <div class="alert-item bg-blue-50 border-blue-500 p-4 rounded cursor-pointer" data-step="1">
277
  <div class="flex items-start">
278
  <div class="bg-blue-500 text-white p-2 rounded-full mr-3">
 
280
  </div>
281
  <div class="flex-1">
282
  <div class="flex justify-between items-start">
283
+ <h3 class="font-medium text-blue-800">检测到钓鱼邮件</h3>
284
  <span class="bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">邮件安全网关</span>
285
  </div>
286
  <p class="text-sm text-gray-600 mt-1">[严重] 检测到仿冒发件人邮件 | 发件人: itsupport@fakecompany[.]com → 目标: victim@corp.com</p>
 
288
  </div>
289
  </div>
290
 
291
+ <!-- 步骤2告警 -->
292
  <div class="alert-item bg-red-50 border-red-500 p-4 rounded cursor-pointer" data-step="2">
293
  <div class="flex items-start">
294
  <div class="bg-red-500 text-white p-2 rounded-full mr-3">
 
296
  </div>
297
  <div class="flex-1">
298
  <div class="flex justify-between items-start">
299
+ <h3 class="font-medium text-red-800">恶意进程注入</h3>
300
  <span class="bg-red-100 text-red-800 text-xs px-2 py-1 rounded">终端检测与响应 (EDR)</span>
301
  </div>
302
  <p class="text-sm text-gray-600 mt-1">[高危] 可疑进程注入行为 | 进程: C:\Windows\System32\explorer.exe → 加载内存模块: a09xdf.dll</p>
 
304
  </div>
305
  </div>
306
 
307
+ <!-- 步骤3告警 -->
308
  <div class="alert-item bg-purple-50 border-purple-500 p-4 rounded cursor-pointer" data-step="3">
309
  <div class="flex items-start">
310
  <div class="bg-purple-500 text-white p-2 rounded-full mr-3">
 
312
  </div>
313
  <div class="flex-1">
314
  <div class="flex justify-between items-start">
315
+ <h3 class="font-medium text-purple-800">可疑C2通信</h3>
316
  <span class="bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded">网络流量分析 (NTA)</span>
317
  </div>
318
  <p class="text-sm text-gray-600 mt-1">[紧急] 异常外联行为 | 目标IP: 54.231.1.1（归属AWS新加坡） | 协议: HTTPS</p>
 
320
  </div>
321
  </div>
322
 
323
+ <!-- 步骤4告警 -->
324
  <div class="alert-item bg-yellow-50 border-yellow-500 p-4 rounded cursor-pointer" data-step="4">
325
  <div class="flex items-start">
326
  <div class="bg-yellow-500 text-white p-2 rounded-full mr-3">
 
328
  </div>
329
  <div class="flex-1">
330
  <div class="flex justify-between items-start">
331
+ <h3 class="font-medium text-yellow-800">检测到凭据窃取</h3>
332
  <span class="bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded">身份认证异常检测 (UEBA)</span>
333
  </div>
334
  <p class="text-sm text-gray-600 mt-1">[高危] 异常浏览器会话 | 用户: Victim_Account | IP来源: 172.16.1.23 → 登录设备指纹突变</p>
 
336
  </div>
337
  </div>
338
 
339
+ <!-- 步骤5告警 -->
340
  <div class="alert-item bg-green-50 border-green-500 p-4 rounded cursor-pointer" data-step="5">
341
  <div class="flex items-start">
342
  <div class="bg-green-500 text-white p-2 rounded-full mr-3">
 
344
  </div>
345
  <div class="flex-1">
346
  <div class="flex justify-between items-start">
347
+ <h3 class="font-medium text-green-800">敏感数据访问</h3>
348
  <span class="bg-green-100 text-green-800 text-xs px-2 py-1 rounded">DLP (数据防泄漏)</span>
349
  </div>
350
  <p class="text-sm text-gray-600 mt-1">[严重] 敏感数据访问行为 | 用户: Victim_Account | 操作: 下载文档ID: YUQUE-1234</p>
 
352
  </div>
353
  </div>
354
 
355
+ <!-- 步骤6告警 -->
356
  <div class="alert-item bg-indigo-50 border-indigo-500 p-4 rounded cursor-pointer" data-step="6">
357
  <div class="flex items-start">
358
  <div class="bg-indigo-500 text-white p-2 rounded-full mr-3">
 
360
  </div>
361
  <div class="flex-1">
362
  <div class="flex justify-between items-start">
363
+ <h3 class="font-medium text-indigo-800">数据库服务器入侵</h3>
364
  <span class="bg-indigo-100 text-indigo-800 text-xs px-2 py-1 rounded">HIDS (主机入侵检测)</span>
365
  </div>
366
  <p class="text-sm text-gray-600 mt-1">[紧急] 非常规时间SSH登录 | 账号: dba_admin | 来源IP: 10.8.8.12 | 操作: 执行SHOW DATABASES</p>
 
368
  </div>
369
  </div>
370
 
371
+ <!-- 步骤7告警 -->
372
  <div class="alert-item bg-pink-50 border-pink-500 p-4 rounded cursor-pointer" data-step="7">
373
  <div class="flex items-start">
374
  <div class="bg-pink-500 text-white p-2 rounded-full mr-3">
 
376
  </div>
377
  <div class="flex-1">
378
  <div class="flex justify-between items-start">
379
+ <h3 class="font-medium text-pink-800">检测到数据外泄</h3>
380
  <span class="bg-pink-100 text-pink-800 text-xs px-2 py-1 rounded">全流量威胁回溯</span>
381
  </div>
382
  <p class="text-sm text-gray-600 mt-1">[严重] 异常数据传输 | 协议: DNS TXT记录 | 目标域: xyz.attacker[.]com | 数据量: 142MB</p>
 
388
  </div>
389
 
390
  <script>
391
+ // 攻击步骤数据
392
  const attackSteps = {
393
  1: {
394
  title: "钓鱼邮件投递",
 
434
  }
435
  };
436
 
437
+ // 绘制带箭头的曲线连接节点
438
  function drawCurvedLine(svg, fromSelector, toSelector, color = "red", width = 2, animate = false) {
439
  const fromEl = document.querySelector(fromSelector);
440
  const toEl = document.querySelector(toSelector);
 
450
  const x2 = toRect.left + toRect.width/2 - svgRect.left;
451
  const y2 = toRect.top + toRect.height/2 - svgRect.top;
452
 
453
+ // 计算控制点使曲线更平滑
454
  const dx = x2 - x1;
455
  const dy = y2 - y1;
456
  const controlX1 = x1 + dx * 0.5;
 
458
  const controlX2 = x1 + dx * 0.5;
459
  const controlY2 = y2;
460
 
461
+ // 创建路径
462
  const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
463
  path.setAttribute("d", `M${x1},${y1} C${controlX1},${controlY1} ${controlX2},${controlY2} ${x2},${y2}`);
464
  path.setAttribute("stroke", color);
 
472
 
473
  svg.appendChild(path);
474
 
475
+ // 添加箭头标记
476
  const marker = document.createElementNS("http://www.w3.org/2000/svg", "marker");
477
  marker.setAttribute("id", `arrow-${color.replace('#', '')}`);
478
  marker.setAttribute("viewBox", "0 0 10 10");
 
491
 
492
  path.setAttribute("marker-end", `url(#arrow-${color.replace('#', '')})`);
493
 
494
+ // 在线上添加步骤序号
495
  const pathLength = path.getTotalLength();
496
  const midPoint = path.getPointAtLength(pathLength * 0.5);
497
 
 
504
  text.setAttribute("fill", color);
505
  text.setAttribute("font-weight", "bold");
506
 
507
+ // 从目标节点获取步骤序号
508
  const toNode = document.querySelector(toSelector);
509
  if (toNode) {
510
  const seqNumElement = toNode.querySelector('.sequence-number');
 
514
  }
515
 
516
  svg.appendChild(text);
517
+
518
+ return path;
519
  }
520
 
521
+ // 显示攻击详情侧边栏
522
  function showAttackDetails(stepId) {
523
  const step = attackSteps[stepId];
524
  if (!step) return;
 
528
  document.getElementById("step-products").innerHTML = `<p class="text-sm text-gray-600">${step.products}</p>`;
529
  document.getElementById("step-alerts").innerHTML = `<p class="text-sm text-gray-600">${step.alerts}</p>`;
530
 
531
+ // 高亮选中的节点
532
  document.querySelectorAll('.attack-node').forEach(node => {
533
  node.classList.remove('critical');
534
  });
535
  document.getElementById(`step${stepId}`).classList.add('critical');
536
 
537
+ // 打开侧边栏
538
  document.getElementById("attack-sidebar").classList.add("open");
539
  }
540
 
541
+ // 初始化可视化
542
  function initVisualization() {
543
  const svg = document.getElementById("attack-flow");
544
  svg.innerHTML = "";
545
 
546
+ // 绘制所有攻击路径，使用不同颜色区分
547
+ drawCurvedLine(svg, "#attacker", "#step1", "#3b82f6", 2); // 蓝色
548
+ drawCurvedLine(svg, "#step1", "#step2", "#ef4444", 2); // 红色
549
+ drawCurvedLine(svg, "#step2", "#step3", "#8b5cf6", 2); // 紫色
550
+ drawCurvedLine(svg, "#step3", "#step4", "#f59e0b", 2); // 黄色
551
+ drawCurvedLine(svg, "#step4", "#step5", "#10b981", 2); // 绿色
552
+ drawCurvedLine(svg, "#step5", "#step6", "#6366f1", 2); // 靛蓝
553
+ drawCurvedLine(svg, "#step6", "#step7", "#ec4899", 2); // 粉色
554
+ drawCurvedLine(svg, "#step7", "#final-c2", "#ef4444", 2); // 红色
555
+ drawCurvedLine(svg, "#final-c2", "#attacker", "#ef4444", 2, true); // 动画红色
556
  }
557
 
558
+ // 缩放功能
559
  let scale = 1;
560
  const zoomContainer = document.getElementById("zoom-container");
561
 
 
576
  zoomContainer.style.transform = `scale(${scale})`;
577
  });
578
 
579
+ // 节点拖拽功能
580
+ function setupDraggableNodes() {
581
+ const nodes = document.querySelectorAll('.attack-node');
582
+ let selectedNode = null;
583
+ let offsetX, offsetY;
584
+
585
+ nodes.forEach(node => {
586
+ node.addEventListener('mousedown', (e) => {
587
+ if (e.button !== 0) return; // 只响应左键
588
+
589
+ selectedNode = node;
590
+ const rect = node.getBoundingClientRect();
591
+ offsetX = e.clientX - rect.left;
592
+ offsetY = e.clientY - rect.top;
593
+
594
+ // 提升选中节点的z-index
595
+ nodes.forEach(n => n.style.zIndex = 2);
596
+ selectedNode.style.zIndex = 10;
597
+
598
+ e.preventDefault();
599
+ });
600
+ });
601
+
602
+ document.addEventListener('mousemove', (e) => {
603
+ if (selectedNode) {
604
+ const container = document.getElementById('flow-container');
605
+ const containerRect = container.getBoundingClientRect();
606
+
607
+ // 计算新位置，限制在容器内
608
+ let left = e.clientX - containerRect.left - offsetX;
609
+ let top = e.clientY - containerRect.top - offsetY;
610
+
611
+ // 边界检查
612
+ left = Math.max(0, Math.min(left, containerRect.width - selectedNode.offsetWidth));
613
+ top = Math.max(0, Math.min(top, containerRect.height - selectedNode.offsetHeight));
614
+
615
+ selectedNode.style.left = `${left}px`;
616
+ selectedNode.style.top = `${top}px`;
617
+
618
+ // 重绘连接线
619
+ initVisualization();
620
+ }
621
+ });
622
+
623
+ document.addEventListener('mouseup', () => {
624
+ selectedNode = null;
625
+ });
626
+ }
627
+
628
+ // 初始化
629
  document.addEventListener("DOMContentLoaded", () => {
630
  initVisualization();
631
+ setupDraggableNodes();
632
 
633
+ // 为攻击节点添加点击事件
634
  for (let i = 1; i <= 7; i++) {
635
  document.getElementById(`step${i}`).addEventListener("click", () => {
636
  showAttackDetails(i);
637
  });
638
  }
639
 
640
+ // 为时间线告警添加点击事件
641
  document.querySelectorAll('.alert-item').forEach(alert => {
642
  alert.addEventListener('click', () => {
643
  const stepId = alert.getAttribute('data-step');
 
645
  });
646
  });
647
 
648
+ // 关闭侧边栏
649
  document.getElementById("close-sidebar").addEventListener("click", () => {
650
  document.getElementById("attack-sidebar").classList.remove("open");
651
  document.querySelectorAll('.attack-node').forEach(node => {
 
653
  });
654
  });
655
 
656
+ // 点击空白处关闭侧边栏
657
+ document.getElementById('flow-container').addEventListener('click', (e) => {
658
+ if (e.target === document.getElementById('flow-container')) {
659
+ document.getElementById("attack-sidebar").classList.remove("open");
660
+ document.querySelectorAll('.attack-node').forEach(node => {
661
+ node.classList.remove('critical');
662
+ });
663
+ }
664
+ });
665
+
666
+ // 节点悬停效果
667
  document.querySelectorAll('.attack-node').forEach(node => {
668
  node.addEventListener('mouseenter', () => {
669
  node.classList.add('shadow-md');
prompts.txt CHANGED
@@ -3,4 +3,5 @@
3
  将以下攻击步骤转化为图表的形式进行展示，在一个图表中完整按顺序展示攻击步骤，图表支持放大缩小，图表中的连线和连线不要重叠。以攻击者为起点，每个节点为一个攻击行为，每个攻击节点之间按顺序用剪头进行连接，每个攻击节点点开后侧边弹窗展示具体的攻击行为内容，图表下方展示每个步骤触发的防护产品名称和告警信息内容。步骤1：钓鱼邮件投递 ● 攻击行为：伪造"拥抱AI变革"通知邮件，内含带恶意木马的文件（伪造成files.zip文件） ● 触发防护：邮件安全网关 ● 告警信息：[严重] 检测到仿冒发件人邮件 | 发件人: itsupport@fakecompany[.]com → 目标: victim@corp.com | 包含恶意附件哈希(SHA256: a1b2c3...) | 判定为Emotet钓鱼模板 步骤2：木马执行 ● 攻击行为：受害者下载木马文件后触发PowerShell脚本，下载Cobalt Strike DLL并注入到合法进程 ● 触发防护：终端检测与响应（EDR） ● 告警信息：[高危] 可疑进程注入行为 | 进程: C:\Windows\System32\explorer.exe → 加载内存模块: a09xdf.dll | DLL签名无效且匹配已知Cobalt Strike特征码 步骤3：C2通道建立与横向移动 ● 攻击行为：通过CDN域名的HTTPS心跳通信（如api.cloudfront[.]com），部署反向SSH隧道至内网跳板机 ● 触发防护：网络流量分析（NTA） ● 告警信息：[紧急] 异常外联行为 | 目标IP: 54.231.1.1（归属AWS新加坡） | 协议: HTTPS | 证书指纹异常（CN=*.cloudfront[.]com但签发者匹配Let's Encrypt野生证书） 步骤4：凭据窃取与浏览器模拟 ● 攻击行为：利用Mimikatz提取Chrome浏览器Cookie并伪造User-Agent（同步受害者浏览器指纹） ● 触发防护：身份认证异常检测（UEBA） ● 告警信息:[高危] 异常浏览器会话 | 用户: Victim_Account | IP来源: 172.16.1.23 → 登录设备指纹突变（新增虚拟机特征/QEMU虚拟显卡） 步骤5：云文档渗透 ● 攻击行为：通过劫持的语雀API Token访问《生产环境运维手册》，提取内嵌的SSH私钥（Base64编码） ● 触发防护：DLP（数据防泄漏） ● 告警信息：[严重] 敏感数据访问行为 | 用户: Victim_Account | 操作: 下载文档ID: YUQUE-1234 | 内容匹配关键字: "prod_ssh_private_key" 步骤6：生产网络入侵 ● 攻击行为：通过跳板机使用SSH证书登陆MySQL数据库服务器（IP: 10.8.8.88，账号: dba_admin） ● 触发防护：HIDS（主机入侵检测） ● 告警信息：[紧急] 非常规时间SSH登录 | 账号: dba_admin | 来源IP: 10.8.8.12（测试环境跳板机） | 操作: 执行SHOW DATABASES 步骤7：数据外泄 ● 攻击行为：将压缩加密后的客户数据（文件名: taobaodata.tar.gz.enc）通过DNS隧道传输到alibaba-bas.com ● 触发防护：全流量威胁回溯 ● 告警信息：[严重] 异常数据传输 | 协议: DNS TXT记录 | 目标域: xyz.attacker[.]com | 数据量: 142MB（超阈值500%）
4
  1、调整图表中的节点大小，确保图表可以完整展示全部的攻击节点 2、每个攻击节点之间按顺序用剪头进行连接
5
  1. 缩小每个节点的大小确保图表可以完整清晰的展示全部攻击节点和节点之间的执行顺序
6
- 按攻击步骤顺序增加攻击节点之间的连线箭头
 
 
3
  将以下攻击步骤转化为图表的形式进行展示，在一个图表中完整按顺序展示攻击步骤，图表支持放大缩小，图表中的连线和连线不要重叠。以攻击者为起点，每个节点为一个攻击行为，每个攻击节点之间按顺序用剪头进行连接，每个攻击节点点开后侧边弹窗展示具体的攻击行为内容，图表下方展示每个步骤触发的防护产品名称和告警信息内容。步骤1：钓鱼邮件投递 ● 攻击行为：伪造"拥抱AI变革"通知邮件，内含带恶意木马的文件（伪造成files.zip文件） ● 触发防护：邮件安全网关 ● 告警信息：[严重] 检测到仿冒发件人邮件 | 发件人: itsupport@fakecompany[.]com → 目标: victim@corp.com | 包含恶意附件哈希(SHA256: a1b2c3...) | 判定为Emotet钓鱼模板 步骤2：木马执行 ● 攻击行为：受害者下载木马文件后触发PowerShell脚本，下载Cobalt Strike DLL并注入到合法进程 ● 触发防护：终端检测与响应（EDR） ● 告警信息：[高危] 可疑进程注入行为 | 进程: C:\Windows\System32\explorer.exe → 加载内存模块: a09xdf.dll | DLL签名无效且匹配已知Cobalt Strike特征码 步骤3：C2通道建立与横向移动 ● 攻击行为：通过CDN域名的HTTPS心跳通信（如api.cloudfront[.]com），部署反向SSH隧道至内网跳板机 ● 触发防护：网络流量分析（NTA） ● 告警信息：[紧急] 异常外联行为 | 目标IP: 54.231.1.1（归属AWS新加坡） | 协议: HTTPS | 证书指纹异常（CN=*.cloudfront[.]com但签发者匹配Let's Encrypt野生证书） 步骤4：凭据窃取与浏览器模拟 ● 攻击行为：利用Mimikatz提取Chrome浏览器Cookie并伪造User-Agent（同步受害者浏览器指纹） ● 触发防护：身份认证异常检测（UEBA） ● 告警信息:[高危] 异常浏览器会话 | 用户: Victim_Account | IP来源: 172.16.1.23 → 登录设备指纹突变（新增虚拟机特征/QEMU虚拟显卡） 步骤5：云文档渗透 ● 攻击行为：通过劫持的语雀API Token访问《生产环境运维手册》，提取内嵌的SSH私钥（Base64编码） ● 触发防护：DLP（数据防泄漏） ● 告警信息：[严重] 敏感数据访问行为 | 用户: Victim_Account | 操作: 下载文档ID: YUQUE-1234 | 内容匹配关键字: "prod_ssh_private_key" 步骤6：生产网络入侵 ● 攻击行为：通过跳板机使用SSH证书登陆MySQL数据库服务器（IP: 10.8.8.88，账号: dba_admin） ● 触发防护：HIDS（主机入侵检测） ● 告警信息：[紧急] 非常规时间SSH登录 | 账号: dba_admin | 来源IP: 10.8.8.12（测试环境跳板机） | 操作: 执行SHOW DATABASES 步骤7：数据外泄 ● 攻击行为：将压缩加密后的客户数据（文件名: taobaodata.tar.gz.enc）通过DNS隧道传输到alibaba-bas.com ● 触发防护：全流量威胁回溯 ● 告警信息：[严重] 异常数据传输 | 协议: DNS TXT记录 | 目标域: xyz.attacker[.]com | 数据量: 142MB（超阈值500%）
4
  1、调整图表中的节点大小，确保图表可以完整展示全部的攻击节点 2、每个攻击节点之间按顺序用剪头进行连接
5
  1. 缩小每个节点的大小确保图表可以完整清晰的展示全部攻击节点和节点之间的执行顺序
6
+ 按攻击步骤顺序增加攻击节点之间的连线箭头
7
+ 优化建议 1. 图表中的连线和节点不要重叠 2. 节点和连线在图表上可以自由拖拽 3. 攻击者的节点队颜色用红色高亮展示，并将攻击者名称换为BAS AI Hacker 4. 侧边弹窗中通过颜色区分攻击者行为、防护产品、告警信息，点击图表空白处关闭弹窗 5. 全部语言换成中文