<p>需配置 Timing-Allow-Origin 头以启用跨域资源时间数据采集，否则浏览器将 connectStart 等字段置为 0；必须启用 mod_headers 模块并使用 Header always set，且该头值须与 Access-Control-Allow-Origin 一致或为 * 或指定空格分隔的域名列表。</p>
要在 Apache 中通过 mod_headers 配置 Timing-Allow-Origin，核心目标是让前端性能监控（如 Resource Timing、Navigation Timing）能跨域采集到完整的高精度时间字段（如 connectStart、responseEnd 等），否则浏览器会将这些字段置为 0。
为什么需要 Timing-Allow-Origin
当监控脚本从域名 A 加载，但请求资源来自域名 B（例如静态资源 CDN 或 API 接口）时，浏览器默认屏蔽跨域请求的详细 timing 数据。只有服务端明确响应 Timing-Allow-Origin 头，并且其值匹配或通配请求来源，浏览器才解封这些字段。
注意：它和 Access-Control-Allow-Origin 是独立头，不互相替代；即使已配置 CORS，若没加这个头，timing 仍被截断。
正确配置 Timing-Allow-Origin 的方式
推荐在虚拟主机或全局配置中使用 <Location> 或 <FilesMatch> 精确作用域，避免对所有响应误加：
前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。前端设计与 UI/UX 全方位优化专家。覆盖视觉层次、排版系统、色彩理论、响应式布局、交互体验、动画动效、无障碍访问、性能优化八大维度，帮助开发者将普通页面升级为高品质产品级界面。
立即学习“前端免费学习笔记（深入）”；
- 若允许所有监控调用方（如内部 CDN + 前端域名）：
Header always set Timing-Allow-Origin "*" - 若只允许特定来源（更安全，尤其对外服务）：
Header always set Timing-Allow-Origin "https://your-app.com https://cdn.your-company.net"（多个域名用空格分隔，不能用逗号） - 搭配 CORS 使用时需注意：
如果
Access-Control-Allow-Origin设为具体域名（非*），则Timing-Allow-Origin必须与之完全一致或也设为该域名；两者不匹配会导致 timing 仍被屏蔽。
必须启用 mod_headers 并确保 always 语义
mod_headers 模块必须已启用（检查：apachectl -M | grep headers）；未启用会导致 500 错误。
务必使用 Header always set，而非 Header set：
-
always确保该头注入到所有响应中，包括由mod_proxy、mod_rewrite或静态文件模块生成的响应； - 普通
set在 OPTIONS 预检、错误页、代理转发等场景下常失效，导致 timing 头缺失。
验证是否生效
在浏览器开发者工具 Network 面板中选中一个跨域资源请求，查看 Response Headers：
- 确认存在
Timing-Allow-Origin字段； - 打开 Console，运行：
performance.getEntriesByType('resource')，检查某条记录的connectStart是否为大于 0 的数值（不是 0 或 NaN）； - 若仍为 0，检查控制台是否有类似 “The resource timing data is not available due to cross-origin restrictions” 提示，说明头未命中或不匹配。
