BOM View

一个简单的静态Web应用程序，用于显示来自软件物料清单（SBOM）文件的软件依赖项。由于是静态站点，可以轻松托管在任何静态Web托管服务上，例如GitLab Pages、GitHub Pages或Netlify。

功能

SBOM查看器：以清晰、可搜索的表格显示CycloneDX/SPDX JSON SBOM中的组件。
动态加载：无需重建站点即可添加和显示SBOM。
按需漏洞扫描：使用osv.dev数据库扫描单个包或整个SBOM的已知漏洞。此外，BOM View还可以显示由Grype或Trivy等工具生成的CycloneDX SBOM中已包含（“内置”）的漏洞。
- 生成带漏洞的SBOM示例：
  - Trivy：trivy image <image> --format=cyclonedx --output=sbom.json --scanners vuln
  - Grype：grype <image> --output cyclonedx-json > sbom.json
- 注意： 此功能目前仅支持CycloneDX SBOM。
OpenSSF评分卡：通过OpenSSF Scorecard的安全评分丰富包数据，提供供应链安全状况的洞察。

支持的格式

目前，BOM View支持CycloneDX和SPDX格式的JSON。这些格式可以由syft等工具生成。

向站点添加SBOM

此应用程序设计为在运行时动态加载SBOM。要添加您自己的SBOM，无需重建项目。请在部署的静态站点根目录（例如，由页面作业提供的dist或public文件夹）中执行以下步骤。

创建sboms目录：如果尚不存在，请创建一个名为sboms的目录。
添加您的SBOM：将您的CycloneDX/SPDX JSON文件复制到sboms目录中。
更新索引文件：在sboms目录内创建或更新一个名为index.json的文件。该文件告诉应用程序哪些SBOM可用。它必须包含一个由字符串组成的JSON数组，其中每个字符串是该目录中一个SBOM的文件名。

例如，如果您有my-app.json和another-lib.json，则index.json文件应如下所示：
```
[
  "my-app.json",
  "another-lib.json"
]
```

然后，应用程序将获取index.json以填充SBOM选择下拉列表，并在选择时加载相应的文件。

GitLab Pages CI/CD 示例

下面是一个.gitlab-ci.yml配置示例，它获取预构建的发布版本，提取SBOM，并动态创建index.json以进行部署。

stages:
  - sbom
  - deploy

create_sbom:
  stage: sbom
  image: alpine:3.23.2
  before_script:
    - apk add syft
  script:
    - mkdir sboms
    - syft alpine:3.19 -o cyclonedx-json=sboms/alpine-cyclone.json
  artifacts:
    paths:
      - sboms

pages:
  stage: deploy
  image: alpine:3.23.2
  before_script:
    - apk add curl jq
  script:
    - curl -L https://github.com/hristiy4n/bom-view/releases/download/v0.4.0/bom-view-v0.4.0-dist.tar.gz | tar zx
    - mv dist public
    - mkdir public/sboms
    - cp sboms/* public/sboms
    - |
      find sboms -maxdepth 1 -type f -name '*.json' ! -name 'index.json' \
      | sed 's|.*/||' \
      | sort \
      | jq -R . | jq -s . > public/sboms/index.json
  needs:
    - job: create_sbom
  artifacts:
    paths:
      - public

您可以在此处查看此配置的实时示例：https://security-dashboard-a9b4f8.gitlab.io/

所需目录结构

最终部署目录应具有以下结构：

dist/
├── assets/
│   └── ... (CSS and JS files)
├── index.html
└── sboms/
    ├── index.json
    ├── sbom1.json
    ├── sbom2.json
    └── ...