因xampp默认未启用mod_headers模块（被注释），导致header指令不生效；需取消httpd.conf中#loadmodule headers_module modules/mod_headers.so的注释，再在对应virtualhost内配置csp头，且确保无php输出干扰、端口策略独立、缓存已清除。
为什么加了多端口后CSP不生效
因为XAMPP默认没启用HTTP头模块，mod_headers 被注释掉了，哪怕你在 httpd-vhosts.conf 里写了 Header set Content-Security-Policy，Apache也根本不会处理。必须先启用模块，再配置头信息。
- 打开
D:\xampp\apache\conf\httpd.conf（Windows）或/Applications/XAMPP/etc/httpd.conf（macOS） - 搜索
mod_headers，找到这行：#LoadModule headers_module modules/mod_headers.so - 删掉开头的
#，保存 - 确保
mod_rewrite也已启用（CSP常配合重写规则做动态策略）
在虚拟主机中正确设置CSP头
不能在全局 httpd.conf 里硬写 Header 指令——它会作用于所有端口和站点，容易冲突；应该按端口/域名粒度，在对应 <virtualhost></virtualhost> 块内配置。
XAMPP 8.0.30
下载
XAMPP 8.0.30 是一款免费、开源的跨平台 Web 服务器集成包，专为快速搭建本地 PHP 开发环境而设计。该版本核心组件包括：Apache 2.4.56、MySQL 8.0.33、PHP 8.0.30、phpMyAdmin 5.2.1 等。它支持 Windows、Linux 和 macOS 系统，可让开发者在个人电脑上轻松模拟服务器环境，无需复杂配置即可运行 WordPress、Thin
- 在
D:\xampp\apache\conf\extra\httpd-vhosts.conf的目标<virtualhost></virtualhost>内添加： Header always set Content-Security-Policy "default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data:;"- 注意：
Header必须放在<directory></directory>块**外部**、内部，否则 Apache 启动报错Invalid command 'Header' - 如果项目用 Vue/React 开发服务器代理（如
localhost:5173），需显式加connect-src 'self' http://localhost:5173
多端口下CSP常见失效场景
不是加了头就万事大吉。端口切换时，浏览器缓存旧响应头、本地开发工具未刷新、甚至XAMPP自带的PHP脚本输出干扰，都会让CSP看似“没起作用”。
- Chrome DevTools → Network → 点开任意请求 → Response Headers 查看是否真有
Content-Security-Policy字段 - 用
curl -I http://localhost:8080验证原始响应头，排除浏览器缓存干扰 - 若页面含 PHP 输出（比如
echo "xxx";在header()之前），会导致 header 发送失败，CSP丢弃——把所有header()或 Apache Header 指令放在 PHP 输出前 - 多个
<virtualhost></virtualhost>共享同一 DocumentRoot 但不同端口时，务必确认每个端口的 CSP 策略独立配置，不要复用粘贴漏改端口号
调试CSP违规而不阻断页面
直接上 block-all-mixed-content 或 default-src 'none' 容易让整个页面白屏。开发阶段建议先用 report-only 模式收集问题。
- 把
Content-Security-Policy换成Content-Security-Policy-Report-Only - 加
report-uri /csp-report.php（需自己写个接收脚本）或用在线服务如https://csp-reporting.com - 注意：XAMPP 默认禁用
AllowOverride All，如果用 .htaccess 写 report-only，要先在<directory></directory>块里放开权限 - Firefox 对
report-uri支持较弱，优先用 Chrome + DevTools → Console 查看CSP violation日志
<virtualhost></virtualhost> 单独验证模块启用、头语法、路径权限三者是否同时成立——少一个，CSP 就静默失效。
