如何检查和验证 HTML 中的 CSP 策略是否有效

浏览器控制台检查

• 加载资源被阻止的提示：当浏览器加载网页时，如果CSP策略生效，它会根据策略来检查每个资源的加载请求。如果请求的资源来源不符合CSP策略中相应指令的规定，浏览器就会阻止该资源的加载，并在控制台显示相关的错误信息。
• 示例错误信息：例如，如果CSP策略规定script - src 'self'，而网页尝试加载一个来自其他未授权域名的脚本，浏览器控制台可能会显示类似于“Content Security Policy: The script from 'https://untrusted - source.com' was blocked”的信息。这种错误信息表明CSP策略正在工作，阻止了不符合策略的资源加载。
• 查看网络请求状态：还可以通过浏览器的开发者工具中的网络（Network）选项卡来查看资源的请求状态。如果某个资源因为CSP策略被阻止，其请求状态可能会显示为“blocked”或者有相应的错误提示。同时，结合控制台中的CSP相关错误信息，可以更准确地判断是哪个资源加载违反了CSP策略。

使用在线工具进行测试

• CSP Evaluator：这是一个专门用于评估CSP策略有效性的在线工具。它可以帮助你分析CSP策略设置的完整性和安全性，检测潜在的安全漏洞。
• 使用步骤：
  • 首先，将你的网站URL输入到CSP Evaluator工具中。
  • 然后，它会自动爬取网页内容，包括HTML、JavaScript、CSS等，并分析其中的CSP策略（如果有）。
  • 最后，它会生成一份详细的报告，指出CSP策略的优点、存在的问题以及可能的改进建议。例如，它可能会指出策略是否过于宽松（如允许过多的unsafe - inline或unsafe - eval），或者是否存在某些资源来源没有得到合理的限制等。

手动测试不同类型的资源加载

• 脚本资源（Script - src）：
  • 创建测试脚本：在HTML页面中，尝试添加一个来自不同来源的脚本标签。例如，在设置了script - src 'self'的CSP策略下，添加一个外部脚本<script src="https://external - source.com/script.js"></script>。
  • 观察结果：如果CSP策略有效，浏览器应该不会加载这个脚本，并且在控制台显示相应的错误。然后再尝试添加一个符合策略的来自自身网站的脚本，看是否能够正常加载。
• 样式资源（Style - src）：
  • 测试内联样式和外部样式：对于样式表，同样可以进行测试。如果CSP策略限制了style - src，尝试添加内联样式（如<style>body { background - color: red; }</style>）和外部样式（如<link rel="stylesheet" href="https://external - source.com/style.css">），观察浏览器是否按照策略允许或阻止这些样式的加载。
• 图像和其他资源（Img - src、Font - src等）：
  • 改变资源来源进行测试：以图像资源为例，在HTML页面中设置一个<img>标签，先使用符合CSP策略规定的图像来源，然后改变为不符合规定的来源，观察图像是否能够正常加载。对于字体资源（如果有相关的CSP策略限制，如font - src），也可以采用类似的方法进行测试，即通过改变字体文件的加载来源来检查CSP策略的有效性。