移动端网页脚本为何无法执行？检查 Content-Security-Policy

CSP 策略如何限制脚本加载

Content-Security-Policy 是一系列指令，告诉浏览器哪些资源可以加载。它主要通过 fetch 指令控制脚本来源，例如 script-src 指定允许加载的域名。如果策略中未包含当前脚本所在的域名，浏览器将拒绝加载该脚本，导致页面功能失效。

CSP 的主要用途是防御跨站脚本攻击。攻击者可能通过 URL 参数或评论注入恶意代码，若网站未对输入进行净化，这些代码可能执行。通过限制资源加载，即使输入净化失败，CSP 也能提供深度防御，阻止恶意脚本运行。

最常见的问题是未在 script-src 中包含当前域名。例如，策略仅允许 'self'，但脚本托管在子域名或第三方 CDN 上，浏览器会拦截。此外，若策略中使用了 'none' 关键字，将完全禁止该类资源的加载。

使用 'unsafe-inline' 关键字虽然允许内联脚本，但这会削弱安全防护。内联脚本是 XSS 攻击的主要载体，应避免使用。正确的做法是使用 nonce 或 hash 来验证内联脚本，确保只有可信的脚本才能执行。

在移动端浏览器开发者工具中，切换到 Network（网络）标签页，刷新页面并查找状态码为 200 但类型为 script 的请求。如果请求被拦截，通常会在 Console（控制台）中看到类似“Refused to execute...”的错误信息，这表明 CSP 策略阻止了加载。

检查响应头中的 Content-Security-Policy 字段。确认 script-src 指令是否包含当前脚本的来源。如果策略过于严格，可以尝试放宽限制，例如添加允许的域名或使用 nonce 机制，然后重新加载页面验证脚本是否正常执行。

推荐使用 nonce 或 hash 来验证内联脚本，而不是依赖 'unsafe-inline'。服务器应在每次响应时生成新的 nonce 并将其包含在 CSP 头和脚本标签的 nonce 属性中，确保只有匹配的脚本才能运行。对于外部脚本，应指定明确的域名并添加 integrity 属性。

CSP 应作为输入净化的补充措施，而非替代品。网站应先对用户输入进行净化，再设置 CSP，以提供深度防御。配置时需确保所有资源类型（如图片、样式）的指令也符合安全要求，避免因单一策略配置不当导致页面功能异常。