课程笔记：CSP 内容安全策略的应用方式

课程名称：计算机网络应用 核心摘要：本讲承接 CSP 概念介绍，重点讲解内容安全策略的两种落地配置方式（全局生效与局部生效），剖析 default-src、form-action、script-src 等指令的语义与通配符用法，介绍违例报告机制（report-uri 与 Content-Security-Policy-Report-Only），并补充浏览器兼容性与 XSS 漏洞扫描工具。

一、核心概念与原理

CSP（Content Security Policy，内容安全策略） 是 HTTP 协议的安全层，用于约束浏览器可加载的资源来源，是防御 XSS（跨站脚本攻击） 的重要手段。
CSP 通过 HTTP 响应头 或 HTML meta 标签 下发策略，由浏览器端强制执行。
策略由若干 指令（directive） 组成，每条指令以 指令名源列表 的形式书写，多条指令以 分号 ; 分隔。
'self' 表示 当前域名，且 不包含子域名；如需包含子域名需使用通配符，如 *.lagou.com。

二、技术细节与协议分析

2.1 两种配置方式对比

维度	全局配置（推荐）	局部配置
生效范围	全局生效，对所有请求生效	仅对具体网页生效
承载位置	Nginx 服务器 / 流量网关 / 业务网关	HTML 页面内的 meta 标签
实现形式	修改 Nginx 配置文件或编写全局过滤器	在页面 `<meta>` 中声明
优先级	较低	较高（冲突时局部覆盖全局）
共存性	可与局部配置同时存在	可与全局配置同时存在

2.2 关键指令语义

指令	含义	示例
`default-src`	默认资源加载源，未单独指定的指令回退到此	`default-src 'self'`
`script-src`	JavaScript 脚本加载源	`script-src rap.lagou.com`
`style-src`	CSS 样式加载源	`style-src css.example.com`
`img-src`	图片加载源	`img-src *`（任意来源）
`media-src`	音频/视频等多媒体加载源	`media-src m.a.com m.b.com`
`form-action`	表单提交目标域	`form-action 'self'`

2.3 策略书写规则

多条指令以 分号 ; 分隔，同一指令的多个源以空格分隔。
http: / https: 表示只允许通过对应协议以 外联方式 引用资源，不允许相对路径。
* 表示任意来源；*.lagou.com 表示当前域名及其所有子域名。
指定 https://域名 表示强制使用加密协议访问，常见于银行类网站。

2.4 违例报告机制

响应头	行为
`Content-Security-Policy` + `report-uri`	既拦截违规资源，又上报违例信息
`Content-Security-Policy-Report-Only` + `report-uri`	只记录、不拦截，用于观察期

report-uri 指向一个由服务端自行实现的 API 接口，用于接收违例报告。
报告以 JSON 格式提交，主要字段：

字段	含义
`document-uri`	发生违规的网页资源地址
`referrer`	跳转到目标资源的来源页面
`blocked-uri`	被阻塞的违规资源路径
`violated-directive`	被违反的指令名

三、实践应用与配置命令

3.1 Nginx 全局配置（推荐方案）

在 nginx.conf 中通过 add_header 增加响应头：

# 限制默认资源仅从当前域名加载，并启用违例上报
add_header Content-Security-Policy "default-src 'self'; report-uri /api/csp-report";

3.2 业务网关全局过滤器（代码方式）

适用于仅有 Spring Cloud Gateway 业务网关、无流量网关的场景：

// 在全局过滤器中通过 response 对象设置响应头
response.setHeader(
    "Content-Security-Policy",                // header 名称
    "default-src 'self' http: https:"         // header 值：具体策略
);

3.3 局部配置（meta 标签）

在 HTML 页面内声明，优先级高于全局配置：

<!-- http-equiv 为 key，content 为具体策略 -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'">

3.4 典型策略示例

# 示例1：仅允许外联方式（HTTP/HTTPS）引用 JS/CSS，不允许相对路径
default-src 'self' http: https:

# 示例2：表单只能向当前域名提交（同域名，不含子域名）
form-action 'self'

# 示例3：限制所有外部资源仅从当前域名加载（不含子域名）
default-src 'self'

# 示例4：当前域名 + 所有子域名
default-src *.lagou.com

# 示例5：多指令组合
# default-src 当前域名；img-src 任意来源；media-src 仅限两个域名；script-src 限指定域名
default-src 'self'; img-src *; media-src m.a.com m.b.com; script-src rap.lagou.com

# 示例6：银行类网站，强制 HTTPS + 指定域名
Content-Security-Policy: default-src https://secure.bank.com

# 示例7：违例报告（既拦截又上报）
Content-Security-Policy: default-src 'self'; report-uri /api/csp-report

# 示例8：仅上报不拦截（观察期）
Content-Security-Policy-Report-Only: default-src 'none'; style-src css.example.com; report-uri /api/csp-report

四、重点与难点提示

配置方式选择：优先选用 Nginx/流量网关的 全局配置，局部 meta 仅作补充；两者冲突时 局部优先。
'self' 的边界：仅代表当前域名，不含子域名；需子域名必须用 *.域名。
form-action 'self'：表单只能向同域名提交，不能向子域名提交（如访问 lagou.com 时不能提交到 edu.lagou.com）。
default-src 'none'：表示默认策略不生效，需依赖后续具体指令（如 style-src）逐项放行。
Content-Security-Policy vs Content-Security-Policy-Report-Only：前者拦截+上报，后者只观察不拦截，上线前建议先用后者收集违例。
report-uri 接口需自行实现：服务端需编写接口解析 JSON 报告，记录违规日志，再据此调整应用策略。
浏览器兼容性：主流浏览器均支持 CSP——Chrome 25+、Firefox 23+、Safari 11+，PC 与移动端均覆盖。
XSS 漏洞扫描必做：不能等用户发现漏洞再打补丁，应主动扫描；常见工具统称 AppScan（含商业与免费版本，如 IBM AppScan），可扫描 XSS、CSRF、URL 跳转等多种漏洞。

五、课后疑问/遗留问题

违例报告接口 /api/csp-report 的具体实现代码与服务端日志存储方案？
Content-Security-Policy-Report-Only 观察期一般持续多久后切换为强制策略？
除了 CSP，还有哪些 HTTP 安全响应头（如 X-Frame-Options、X-Content-Type-Options、Strict-Transport-Security）可配合防御 XSS？
AppScan 等扫描工具的具体使用流程与扫描报告解读？