SysReptor项目中实现可引用漏洞ID的技术方案

在安全测试报告编写过程中，为漏洞(Finding)分配可引用的唯一标识符是提高报告专业性和可读性的重要实践。SysReptor作为安全报告生成工具，提供了灵活的机制来实现这一需求。

核心需求分析

安全工程师通常需要在报告中实现以下功能：

1. 为每个漏洞生成格式化的唯一ID（如"24-7:10"）
2. 支持在报告内容中交叉引用这些ID
3. 确保引用链接在PDF导出后仍保持有效

技术实现方案

SysReptor内部使用UUID作为漏洞的唯一标识符，可通过finding.id访问。要实现自定义格式的引用ID，可以采用以下技术组合：

1. HTML模板层实现

<div v-for="(finding, findingIndex) in findings">
  <h2 
    :id="finding.id" 
    class="in-toc finding-title" 
    :data-finding-prefix="`Finding ${report.report_number}:${findingIndex + 1}`"
    :data-toc-title="`Finding ${report.report_number}:${findingIndex + 1} - ${finding.title}`"
  >{{ finding.title }}</h2>
</div>

2. CSS样式层处理

/* 将自定义ID显示在标题前 */
.finding-title::before {
    content: attr(data-finding-prefix);
    margin-right: 0.5em;
}

/* 处理引用时的显示格式 */
.markdown .ref.ref-heading::before {
    content: target-text(attr(href), before);
}
.markdown .ref.ref-heading .ref-title {
    display: none;
}

实现原理详解

1. 数据绑定：通过Vue的:data-*绑定将格式化ID存储在DOM元素的data属性中
2. CSS内容生成：使用attr()和::before伪元素将存储的ID显示出来
3. 引用处理：利用CSS的target-text()函数获取被引用元素的显示内容
4. 目录集成：in-toc类确保标题会被收录到文档目录中

生产环境注意事项

1. ID稳定性问题：使用数组索引(findingIndex)生成的ID在报告修改时可能变化，建议：

   • 对于最终版报告可接受
   • 需要版本追踪时应考虑更稳定的ID生成方式

2. 多报告引用：跨报告引用时，建议包含报告编号前缀

3. PDF兼容性：测试确认CSS生成的content在PDF导出后是否保持

高级应用场景

1. 自动化编号：可通过计算属性实现更复杂的编号逻辑
2. 样式定制：为不同严重等级的漏洞添加颜色区分
3. 引用追踪：开发后处理脚本检查无效引用

这种实现方式平衡了灵活性和功能性，既满足了专业报告的需求，又保持了SysReptor模板系统的简洁性。