HTML Academy · 课时

内容安全策略:meta http-equiv

通过 meta http-equiv 设置内容安全策略

第 1 / 4 课13 个步骤

内容安全策略:meta http-equiv 是 CoddyKit 上的免费 HTML Academy 课时。 这是第 1 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 HTML Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 HTML Academy 课程共包含 4 节课。

什么是 CSP?

内容安全策略(CSP)是由浏览器强制执行的策略,用于限制页面可以加载和执行哪些资源。它是防御跨站脚本攻击的最强手段:即使攻击者注入了一个 <script> 标签,浏览器也会拒绝运行它,除非策略允许。

两种传递方式

CSP 可以作为 HTTP 响应标头发送(Content-Security-Policy: ...),也可以作为 HTML 中的元标签发送:<meta http-equiv="Content-Security-Policy" content="...">。标头是首选方式;当您无法控制服务器时,元标签很有用。

<meta http-equiv="Content-Security-Policy"
  content="default-src 'self'; script-src 'self' https://cdn.example.com">

常用指令

default-src 是未指定资源类型时使用的后备指令。script-src、style-src、img-src、connect-src(XHR/请求)、font-src、frame-src 分别限制对应类型的资源。请将特定来源加入允许列表,或者使用 'self' 以仅允许同源资源。

self 关键字

'self'(带引号)指页面自身的来源。script-src 'self' 表示“只运行与页面来自同一来源的脚本”。这是大多数策略的基础;如有需要,再添加特定的外部 CDN。

阻止内联脚本

默认情况下,CSP 会阻止所有内联 <script> 标签和事件处理程序属性(onclick)。这是最强的 XSS 防护:注入的 <script> 无法运行,因为它是内联内容。请将所有脚本移到由 src 引用的外部文件中。

随机数与哈希值

对于必要的内联脚本,请使用 nonce:服务器为每个请求生成一个随机令牌,将其设置为 CSP 中的 script-src 'nonce-RANDOM',并将 nonce="RANDOM" 添加到合法的 <script> 标签中。注入的脚本没有该 nonce,因此会被阻止。

<meta http-equiv="Content-Security-Policy"
  content="script-src 'nonce-abc123'">
<script nonce="abc123">// allowed</script>
<script>// blocked — no nonce</script>

unsafe-inline 与 unsafe-eval

'unsafe-inline' 会重新允许内联脚本和样式。'unsafe-eval' 会重新允许 eval() 和 new Function()。这两者都会严重削弱 CSP——只应在迁移期间作为最后手段使用,并计划移除它们。

元标签的限制

通过元标签交付的 CSP 不能使用 report-uri 指令(或其他报告功能)。它的生效时间也晚于标头——位于元标签之前的任何内容都不受保护。标头明显更好;请仅将元标签作为后备方案。

仅报告模式

在不破坏网站的情况下测试新策略:Content-Security-Policy-Report-Only: ...。浏览器会报告违规行为,但不会阻止它们,因此您可以逐步调整策略,直到它允许所有合法资源,再切换到强制执行模式。

常见陷阱

忘记 style-src 'unsafe-inline' 会阻止内联样式(框架经常生成这类样式)。忘记 connect-src 会阻止通过 AJAX 访问 API。请务必先在仅报告模式下测试策略,并检查控制台中被阻止的资源。

现代 CSP 策略

严格的 CSP 会将 script-src 'nonce-RANDOM' 'strict-dynamic' 用于脚本,并为其他所有内容设置严格的允许列表。'strict-dynamic' 允许带 nonce 的脚本继续加载其他脚本,无需逐一列出每个来源,比按来源设置允许列表更易于维护。

知识检查

即使攻击者成功注入了脚本标签,CSP 如何防御 XSS 攻击?

总结

CSP 是由浏览器强制执行的策略,用于限制可以加载的脚本、样式、图像和其他资源。请通过响应标头(首选)或元标签交付 CSP。对必要的内联脚本使用 nonce,避免使用 unsafe-inline/unsafe-eval,并先在仅报告模式下测试。使用 'nonce-X' 'strict-dynamic' 的严格 CSP 是现代的基础方案。

免费开始

用 AI 导师学习 HTML — 免费

在浏览器中编写并运行真实代码,获得全天候 AI 导师的即时帮助,并在网页或应用中继续学习。

课程
40
课程
159

常见问题解答

「内容安全策略:meta http-equiv」课时是免费的吗?

是的 — 「内容安全策略:meta http-equiv」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 HTML Academy 课程的其余内容,请升级到 CoddyKit PRO。 HTML Academy 课程共包含 4 节课。

「内容安全策略:meta http-equiv」这节课中我会学到什么?

通过 meta http-equiv 设置内容安全策略 你通过在浏览器中直接运行的动手代码来练习 HTML Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 HTML Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 HTML Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 1 节课,共 4 节。

「内容安全策略:meta http-equiv」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 HTML Academy 课中编写并运行代码吗?

能。每节 HTML Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 内容安全策略:meta http-equiv
  2. 通过 innerHTML 引发 XSS 及其预防方法
  3. iframe 沙箱与权限策略
  4. HTTPS 与子资源完整性
← 返回 HTML Academy