---

title: Fetch Metadata与跨站泄露（XS-Leaks）防护最佳实践

keywords:

• Fetch Metadata
• Sec-Fetch-Site
• Sec-Fetch-Mode
• Sec-Fetch-Dest
• XS-Leaks
• 跨站泄露
• 服务器策略

description: 以Fetch Metadata为核心，通过服务器端策略拒绝跨站危险请求，结合COOP/COEP与CSP，构建系统性的XS-Leaks防护。

categories:

• 文章资讯
• 编程技术

---

Fetch Metadata与跨站泄露（XS-Leaks）防护最佳实践

概述

XS-Leaks利用跨站行为与浏览器特性泄露信息。通过读取Fetch Metadata请求头并在服务器执行拒绝策略，可显著降低风险。

服务器策略示例

type Req = { headers: Record<string, string>; method: string; path: string }

function isDangerousCrossSite(req: Req): boolean {
  const site = (req.headers['sec-fetch-site'] || '').toLowerCase()
  const mode = (req.headers['sec-fetch-mode'] || '').toLowerCase()
  const dest = (req.headers['sec-fetch-dest'] || '').toLowerCase()
  // 拒绝跨站对敏感端点的导航或不简单请求
  const sensitive = req.path.startsWith('/account') || req.path.startsWith('/admin')
  const cross = site === 'cross-site'
  const notSimple = mode !== 'cors' && mode !== 'navigate' && mode !== 'same-origin'
  return sensitive && cross && (mode === 'navigate' || notSimple || dest === 'document')
}

function enforceFetchMetadata(req: Req): { allowed: boolean; status: number } {
  if (isDangerousCrossSite(req)) return { allowed: false, status: 403 }
  return { allowed: true, status: 200 }
}

结合COOP/COEP与CSP

Cross-Origin-Opener-Policy: same-origin
Cross-Origin-Embedder-Policy: require-corp
Content-Security-Policy: frame-ancestors 'none'; base-uri 'self'

运维要点

• 对敏感接口启用Fetch Metadata策略与白名单例外
• 与COOP/COEP、CSP协同，降低跨站泄露攻击面
• 在日志中记录 Sec-Fetch-* 以审计跨站访问模式

通过服务器策略与浏览器隔离策略的组合，可在复杂场景下实现可靠的XS-Leaks防护。