浏览器WebCrypto实现C2PA内容溯源

dev.to · AI#EU AI Act#C2PA#WebCrypto

Editor brief · 编辑速览

详解EU AI Act第50(2)(4)条下 generative AI 制品必须携带的C2PA 2.1内容溯源，零依赖纯JS在浏览器端完成ECDSA/Ed25519签名和JUMBF打包。

文章思维导图

Knowledge map

拖拽缩放

Full translation

完整中文译文

Architectural Summary Regulatory & Technical Mandate

根据欧盟AI法案第50(2)条和第50(4)条，生成式AI系统的提供商必须确保所有合成视觉、音频和文本制品都具有防篡改的、机器可读的来源标记。我们的零依赖实现不依赖重型原生C++二进制文件（如通过Node-GYP使用的c2pa-rs），而是采用纯JavaScript JUMBF box打包和浏览器WebCrypto ECDSA/Ed25519签名。

1. EU AI Act Article 50: The 2026 Legal Landscape & Penalties

2026年8月2日，《欧盟人工智能法案》（Regulation EU 2024/1689）第50条规定的透明度义务在全部27个欧盟成员国正式生效。违规将面临高达€15,000,000或全球年营业额3%的严厉行政处罚。

第50条为数字媒体和自动化系统确立了两个不同的合规层级：

第50(2)条 - 生成式输出标注： 生成合成音频、图像、视频或文本的AI系统提供商，必须确保AI系统的输出以机器可读的格式标注，并可被检测为人工生成或操纵。
第50(4)条 - 深度伪造与合成内容披露： 部署生成或操纵构成深度伪造的图像、音频或视频内容的AI系统的运营商，必须以清晰、明确的方式披露该内容已被人工生成或操纵。

2. Anatomy of the C2PA 2.1 Specification & JUMBF Architecture

内容出处与真实性联盟（C2PA）定义了一个开放标准，用于将加密出处元数据嵌入二进制媒体容器。C2PA将数据打包成JUMBF（JPEG Universal Metadata Box Format - ISO/IEC 19566-5） boxes，嵌入到JPEG、PNG、WebP、AVIF、MP4和SVG文件中。

+--------------------------------------------------------------------------------+
| C2PA 2.1 MANIFEST STORE                                                         |
|                                                                                 |
| +--------------------------------------------------------------------------+    |
| | Manifest Container (JUMBF Box 'c2pa')                                      |    |
| |                                                                             |    |
| | +-------------------+ +---------------------------------------------+      |    |
| | | Claim Box         | | Assertions Store (jumbf/c2pa.assertions)    |      |    |
| | | (Hash of bindings)| | - c2pa.actions (e.g. "c2pa.created")        |      |    |
| | +-------------------+ | - c2pa.ai_generative_info (Model parameters) |      |    |
| |                      | - c2pa.hash.data (Byte-range media digest)   |      |    |
| |                      | - schema.org/CreativeWork metadata            |      |    |
| |                      +---------------------------------------------+      |    |
| |                                                                             |    |
| | +--------------------------------------------------------------------+    |    |
| | | Cryptographic Signature Box (jumbf/c2pa.signature)                  |    |    |
| | | - X.509 Certificate Chain / WebCrypto Public Key                    |    |    |
| | | - ECDSA (P-256) / Ed25519 Signed Digest of Claim Box               |    |    |
| | | - RFC 3161 Timestamp Token                                          |    |    |
| | +--------------------------------------------------------------------+    |    |
| +--------------------------------------------------------------------------+    |
+--------------------------------------------------------------------------------+

3. The Native Dependency Trap: Why C++/Rust Fails Frontend Workflows

C2PA工作组提供的参考实现（c2pa-rs）使用Rust编写，并带有C++ FFI绑定。虽然在高吞吐量的原生服务器环境中性能出色，但将其集成到客户端Web应用程序、Next.js无服务器函数或Cloudflare Edge Workers中，会带来巨大的障碍：

4. Building a Zero-Dependency WebCrypto Manifest Signer

利用现代W3C crypto.subtle标准，我们可以直接在原始二进制块上生成加密安全的ECDSA P-256或Ed25519签名，而无需引入OpenSSL或原生工具链：

webcrypto-c2pa-signer.ts (Zero-Dependency Engine)
TypeScript / Pure WebCrypto

export interface C2PAClaim {
  title: string;
  generator: string;
  model: string;
  generationPromptHash: string;
  timestamp: string;
  author: string;
}

export class WebCryptoC2PAForge {
  /**
   * Generates a standard C2PA 2.1 assertion manifest
   */
  public static createAssertionPayload(claim: C2PAClaim, mediaHashHex: string): object {
    return {
      "dc:title": claim.title,
      "c2pa.actions": [
        {
          action: "c2pa.created",
          softwareAgent: `${claim.generator} [Model: ${claim.model}]`,
          when: claim.timestamp
        }
      ],
      "c2pa.ai_generative_info": {
        generation_type: "pure_synthetic",
        model_name: claim.model,
        prompt_sha256: claim.generationPromptHash,
        eu_ai_act_compliance: {
          article: "Article 50(2)",
          status: "verified_machine_readable"
        }
      },
      "c2pa.hash.data": {
        algorithm: "SHA-256",
        digest: mediaHashHex
      }
    };
  }

  /**
   * Signs the assertion digest using browser WebCrypto ECDSA P-256
   */
  public static async signClaim(
    claimBytes: Uint8Array,
    privateKey: CryptoKey
  ): Promise<Uint8Array> {
    const signature = await window.crypto.subtle.sign(
      {
        name: "ECDSA",
        hash: { name: "SHA-256" }
      },
      privateKey,
      claimBytes
    );
    return new Uint8Array(signature);
  }
}

5. Machine-Readable Schema.org JSON-LD Assertions for Search & AEO

除了二进制图像水印，第50条还要求机器可读的网页披露，以便AI爬虫（GPTBot、ClaudeBot、PerplexityBot、Gemini）在检索增强生成（RAG）循环中能够可靠地索引内容出处：

Schema.org Generative AI Provenance LD-JSON
JSON-LD Metadata Snippet

{
  "@context": "https://schema.org",
  "@type": "ImageObject",
  "name": "Neural Concept Architecture",
  "contentUrl": "https://pixeloffice.eu/assets/provenance-demo.png",
  "acquireLicensePage": "https://pixeloffice.eu/legal/ai-provenance",
  "creditText": "Synthesized with Flux 1.1 Pro via Pixel Office Forge",
  "digitalSourceType": "https://schema.org/TrainedAlgorithmicMediaDigitalSource",
  "creator": {
    "@type": "Organization",
    "name": "Pixel Office AI Systems",
    "url": "https://pixeloffice.eu"
  },
  "hasPart": {
    "@type": "CreativeWork",
    "name": "C2PA Provenance Manifest",
    "encodingFormat": "application/x-c2pa-manifest",
    "identifier": "urn:c2pa:sha256:8f4c2e71...99a0"
  }
}

6. Client-Side Provenance Verification & Tamper Detection

验证在客户端浏览器内严格隔离的四个步骤中执行：

1. JUMBF Box扫描： 解析JPEG中的APP11标记或PNG文件中专用的caPI块，以提取嵌入的manifest。
2. 媒体哈希重计算： 排除JUMBF box字节，对原始图像payload计算SHA-256哈希。与c2pa.hash.data进行比较。
3. 签名验证： 使用嵌入的公钥或已验证的X.509根证书验证加密签名。
4. 篡改裁决： 如果图像像素数据或元数据在签名后被修改哪怕一个字节，哈希验证将立即失败。

7. Full Implementation Code: JUMBF Injector & Extractor

以下是完整的、无依赖的二进制注入器，可将JUMBF boxes写入标准PNG和JPEG字节流：

jumbf-injector.js (Pure Vanilla JavaScript)
Binary Box Embedding Engine

export function embedJumbfInPng(originalPngBytes, manifestJsonString) {
  const encoder = new TextEncoder();
  const manifestData = encoder.encode(manifestJsonString);

  // PNG Chunk layout: Length (4B) + Type (4B) + Data (NB) + CRC32 (4B)
  const chunkType = encoder.encode("caPI"); // Custom Provenance Chunk
  const chunkLength = manifestData.length;

  const chunkBuffer = new Uint8Array(12 + chunkLength);
  const view = new DataView(chunkBuffer.buffer);

  // 1. Write length
  view.setUint32(0, chunkLength, false);

  // 2. Write type & data
  chunkBuffer.set(chunkType, 4);
  chunkBuffer.set(manifestData, 8);

  // 3. Compute and write CRC-32 (simplified IEEE 802.3 CRC)
  const crc = computeCrc32(chunkBuffer.subarray(4, 8 + chunkLength));
  view.setUint32(8 + chunkLength, crc, false);

  // Insert before IEND chunk (last 12 bytes of standard PNG)
  const iendOffset = originalPngBytes.length - 12;
  const output = new Uint8Array(originalPngBytes.length + chunkBuffer.length);

  output.set(originalPngBytes.subarray(0, iendOffset), 0);
  output.set(chunkBuffer, iendOffset);
  output.set(originalPngBytes.subarray(iendOffset), iendOffset + chunkBuffer.length);

  return output;
}

function computeCrc32(buf) {
  let crc = -1;
  for (let i = 0; i < buf.length; i++) {
    crc = (crc >>> 8) ^ crcTable[(crc ^ buf[i]) & 0xff];
  }
  return (crc ^ (-1)) >>> 0;
}

const crcTable = new Uint32Array(256);
for (let n = 0; n < 256; n++) {
  let c = n;
  for (let k = 0; k < 8; k++) {
    c = (c & 1) ? (0xedb88320 ^ (c >>> 1)) : (c >>> 1);
  }
  crcTable[n] = c;
}

8. Interactive Forge: C2PA AI Provenance Manifest Forge

在我们的生产应用程序C2PA AI Provenance Manifest Forge中探索，直接在浏览器中运行。拖放任何合成图像或文本制品，自定义生成参数，使用本地WebCrypto密钥签名，几秒内下载符合C2PA标准的认证资产。

            Ensure 100% EU AI Act Article 50 Compliance

            Generate tamper-evident C2PA manifests, JSON-LD schemas, and digital watermark wrappers for your enterprise AI pipelines.

            [
                 Open C2PA Manifest Forge
            ](/showcase/c2pa-ai-provenance-manifest-forge.html)
            [
                View Compliance Hub 
            ](/dashboard.html)

9. Frequently Asked Questions (FAQ)

2026年8月执法生效的EU AI Act第50条核心技术要求是什么？

第50条要求生成合成音频、图像、视频或文本内容的AI系统提供商，必须确保输出以机器可读的格式标注，并可被检测为人工生成或操纵。这些标注必须有效、互操作性强、对压缩或格式转换具有鲁棒性，并可加密验证。

为什么C2PA比专有隐藏水印更受监管合规青睐？

C2PA（内容出处与真实性联盟）是由W3C、Adobe、Microsoft、Google和OpenAI支持的开放、免版税的国际标准。它将加密数字签名（X.509 PKI）、防篡改哈希和结构化JSON-LD断言模式组合成标准容器boxes（JUMBF），任何符合标准的浏览器或验证引擎都可读取。

开发者在没有c2pa-rs等重型C++/Rust二进制文件的情况下如何生成和验证C2PA manifests？

通过为JUMBF（JPEG Universal Metadata Box Format）和ISO BMFF容器结构实现纯JavaScript解析器，结合浏览器的原生WebCrypto API进行ECDSA（ES256）和Ed25519签名。这实现了100%客户端manifest生成和验证，无需Node-gyp绑定、WebAssembly编译问题或原生二进制漏洞。

机器可读网页搜索爬虫应包含哪些Schema.org元数据断言？

包含合成媒体的网页应包含Schema.org JSON-LD，指定digitalSourceType: https://schema.org/TrainedAlgorithmicMediaDigitalSource，以及生成器模型名称、训练时间戳和加密manifest URL在associatedMedia或hasPart节点中。