bobroberts2639/Pangolin-Nostromo-CVE-datamap-pwa-4

GitHub: bobroberts2639/Pangolin-Nostromo-CVE-datamap-pwa-4

一个可离线安装的 PWA,以交互式数据地图可视化近 1.2 万条 CVE 漏洞,按 CVSS severity 和语义聚类着色。

Stars: 0 | Forks: 0

# CVE 景观数据地图 - PWA 可安装、支持离线使用的 Progressive Web App,封装了交互式的 CVE datamap (包含 11,891 个 CVE,时间窗口为 2025 年 7 月 31 日至 10 月 29 日的 90 天 NVD 数据,按 CVSS severity 着色)。 ## 本地运行 Service workers 需要通过 http(s) 提供服务,因此请使用服务器托管该文件夹,而不是双击 index.html: ``` cd Pangolin-Nostromo-CVE-datamap-pwa python -m http.server 8080 ``` 然后打开 http://localhost:8080 - 你的浏览器地址栏会显示一个安装图标 (适用于 Chrome/Edge)将其作为应用添加。一旦加载完成,它可以完全离线工作;点击某个点 仍然会打开实时的 NVD 页面(需要网络连接)。 ## 控制说明 | 操作 | 桌面端 | 触摸 | |---|---|---| | 缩放 | 滚轮、触控板捏合、`+` / `−` 按钮、`+` `−` 键、双击 | 双指捏合 | | 平移 | 拖拽 | 单指拖拽 | | 重置视图 | `⤾` 按钮或 `0` | `⤾` 按钮 | | 图例 | `◧` 按钮或 `L` | `◧` 按钮 | | 在 NVD 打开 CVE | 点击某个点 | 轻触某个点 | 缩放范围被限制在 0.25x - 600x 之间。搜索功能支持按 CVE id、severity 或 cluster label 过滤; 匹配的项会保留其 severity 颜色,并添加一圈对比鲜明的环。 ## Severity 颜色 CVSS severity 是有序的,因此调色板采用从暖到冷的渐变,而不是任意的 分类集合。向着 Critical 级别,亮度和色调都会增加,因此这种排名在 灰度以及红绿色盲情况下依然有效。Critical 级别的点也会绘制得稍大一些,以免 被其他 11,890 个点掩盖。 | Severity | 颜色 | 半径 | 数量 | |---|---|---|---| | Critical | `#FF0033` | x1.35 | 785 | | High | `#FF6D00` | x1.15 | 3,396 | | Medium | `#FFD400` | x1.0 | 4,599 | | Low | `#00C853` | x0.9 | 575 | | Unscored | `#9AA0B4` | x0.8 | 2,536 | `Unscored` 故意*不*放在渐变范围内。没有 CVSS vector 的 CVE 属于数据缺失,而 不是低风险,将其放在从暖到冷的尺度上会意味着一种没人赋予的 severity。 ## 浏览器支持 缩放功能适用于桌面端和移动端上的 Safari、Chrome、Firefox 和 Edge。每条缩放输入 路径——滚轮、WebKit 触控板手势、触摸捏合、按钮、键盘和双击—— 都通过同一个函数处理,因此没有任何引擎会碰到无效的路径而被静默忽略。 特别是 Safari:macOS Safari 不会像 Chrome 和 Firefox 那样将触控板捏合转换为 wheel 事件;而是发出 `gesturestart` / `gesturechange` / `gestureend` 事件。 这些事件已被直接处理。Wheel 增量在各种 `deltaMode` 值之间进行了标准化并限幅。 在 iOS 上,该应用以独立模式安装(会遵循安全区域 insets,因此页眉和 控件会避开刘海和主屏幕指示条),并且点击某个点会通过合成的 anchor 打开 NVD,而不是使用 `window.open`,因为安装后的 iOS PWA 会忽略对外部 URL 的 `window.open` 调用。 ## 部署 任何静态托管服务都可以(约 2.6 MB): - **GitHub Pages**:将此文件夹推送到 repo,然后 Settings > Pages > deploy from branch。 - **Netlify/Cloudflare Pages**:拖放该文件夹即可。 ## 文件 - `index.html` - datamap(所有数据内联)+ PWA 注册 - `manifest.webmanifest` - 应用元数据和图标 - `sw.js` - cache-first service worker - `icon-*.png` - 应用图标 - `assets/custom_template_pwa.html` - 渲染模板(Safari/PWA 的修复位于此处) - `scripts/bright_palette.py` - severity 渐变和 18 色 cluster 调色板 - `scripts/patch_pwa_map.py` - 在无需完整重新渲染的情况下,基于模板重建 index.html ## 更新地图 **每次务必在 sw.js 中更新 `CACHE` 版本。** Service worker 采用 cache-first 策略,否则已安装的 客户端将无限期地继续提供旧的 `index.html`——这样即使发布了更新, 也没有人能看到。目前的版本是 `cve-datamap-v2`。 要在不重新运行 pipeline 的情况下,将模板重新应用到刚渲染的地图上: ``` python3 scripts/patch_pwa_map.py --check # report only python3 scripts/patch_pwa_map.py # rewrite index.html, bump sw.js ``` 它从现有的 `index.html` 中提取 JSON payload,重新着色, 重新注入到 `assets/custom_template_pwa.html` 中,并保留 manifest 链接、图标、标题和 service-worker 路径。常用参数标志:`--mode cluster`(使用 18 色调色板按 cluster 而非 severity 着色)、`--severity-map "#hex=CRITICAL,..."`、`--no-recolor`、 `--no-sw-bump`。原始文件会被复制为 `*.bak`。 若要进行完整的重新渲染,请使用 datamap pipeline 并加上 `--mode custom` 和 `--template assets/custom_template_pwa.html`。
标签:PWA, 前端, 后端开发, 安全, 数据可视化, 漏洞追踪, 超时处理, 逆向工具