shaddy43/DetectionAndResponse

# 检测与响应 防御者的实战笔记：涵盖实用的 DFIR、威胁狩猎与检测工程，从告警 到溯源。与 [恶意软件分析系列](https://shaddy43.github.io/MalwareAnalysisSeries/) 互为姊妹篇 —— 前者是攻击，此为防守。 **在线站点：** https://shaddy43.github.io/DetectionAndResponse/ 这是一个静态站点：没有构建步骤，也没有依赖。仅需纯 HTML、一个共享样式表和一个小型 JavaScript 文件。在浏览器中打开 `index.html` 即可运行。 ## 文章 | # | 文章 | 日期 | |---|---|---| | 01 | [从告警到溯源：结合 Claude Code 与 Velociraptor 的 AI 驱动 DFIR](posts/from-alert-to-answer.html) | 2026年7月23日 | ## 布局 ``` . ├── index.html # Landing page and post list ├── posts/ # One HTML file per post │ └── from-alert-to-answer.html ├── detections/ # Runnable rules published by the posts — see detections/README.md │ ├── velociraptor/ │ └── yara/ └── assets/ ├── css/style.css # The entire stylesheet, light + dark ├── js/site.js # Theme toggle, code-block copy buttons ├── fonts/ # Self-hosted JetBrains Mono (variable woff2 subsets) └── img/ ├── site/ # Site-wide images (avatar, social preview) │ ├── cover.png # Source artwork, 1254×1254 │ └── og-cover.png # 1200×630 crop-safe card used by og:image └── posts// # Everything belonging to one post ``` 资源管理规则：**仅被单篇文章使用的任何资源都存放在 `assets/img/posts//` 下**，并根据其显示内容命名（如 `hero.jpg`、`architecture.png`）。 在站点内多处复用的内容存放在 `assets/img/site/` 下。这样可以避免随着文章增加，`assets/` 变成一堆 杂乱无章的文件。 ## 添加文章 1. 将 `posts/` 中的最新文件复制为 `posts/.html` 并重写正文内容。 2. 更新 ``：包括 `title`、`description`、`canonical`、`og:`/`twitter:` 标签，以及 `BlogPosting` JSON-LD 块（headline、description、`datePublished`、`mainEntityOfPage`）。 这些都是针对单篇文章的 —— 原封不动地复制它们是最容易犯的错误。 3. 将图片以 **WebP** 格式放入 `assets/img/posts//`。务必在 `` 上设置 `width`/`height`， 这样加载时页面就不会发生跳动，并且为首图下方所有的图片设置 `loading="lazy"`。 首图无需设置 `decoding` —— `decoding="async"` 会让浏览器在图片解码前就渲染页面，这与屏幕上最大元素的预期效果 恰好相反。 在编码方面，格式本身不如模式重要。截图、图表及其他纯色图像在**无损 (lossless)** 压缩下比有损压缩效果更好，且能保持像素级完美；照片则需要使用有损压缩 （质量参数设为 85 是不错的默认值）。在提交前对比检查这两种模式 —— 在本站点中，无损压缩在每张截图上的 表现都比有损压缩好 2-3 倍。 4. 如果文章发布了规则或制品 (artifact)，请将该文件添加到 `detections/` 目录下（参见 [`detections/README.md`](detections/README.md)），将其列入该索引表中，并在 文章中通过 `.detection-links` 块添加链接。 5. 在 `index.html` 的 *Latest Posts* 下添加一个 `.post-card`，并更新上方的表格。为 卡片设置 `data-tags` 属性 —— 全小写，使用管道符分隔，例如 `data-tags="dfir|sigma|threat hunting"`。过滤栏会在加载时从这些属性中生成标签切片，因此新标签会自动 出现在索引页上；无需额外维护单独的列表。搜索功能会匹配卡片的可见文本及其标签。 代码块会自动获得复制按钮 —— 加载时 `site.js` 会对 `.article` 内的任何 `

` 元素

进行绑定。无需额外的标记。

## 主题

`assets/css/style.css` 在 `:root` 中将每种颜色定义为 CSS 自定义属性。深色模式

会重新声明同一套 token；样式表中的其他部分完全不需要感知当前启用了哪个主题。

要调整颜色，请同时修改两个调色板中的 token —— 不要在文件后续内容中硬编码十六进制 (hex) 值。

主题默认遵循访问者的操作系统偏好。页眉处的切换按钮可以覆盖此设置，并将选择

持久化到 `localStorage` 的 `dr-theme` 键中。每个页面 `` 中的小型内联脚本

会在首次渲染前应用保存的设置，从而避免出现错误调色板的闪烁。

## 致谢

文章与检测内容由 [Shayan Ahmed Khan (@shaddy43)](https://github.com/shaddy43) 提供。

字体为 [JetBrains Mono](https://www.jetbrains.com/lp/mono/) (OFL)，自托管。

标签：后端开发, 多模态安全, 技术博客, 数字取证, 数据可视化, 管理员页面发现, 网络安全, 自动化脚本, 隐私保护, 静态网站, 项目化管理