已配置*.unpkg.com，为何CSP仍阻止加载gremlins.js脚本？

我正协助一名QA工程师在开发环境控制台运行脚本，当前内容安全策略（CSP）的script-src指令配置如下：

script-src 'unsafe-inline' 'self' *.fontawesome.com *.cloudflare.com *.unpkg.com;

但加载脚本https://unpkg.com/gremlins.js时，收到[Report Only]级别的错误提示：

[Report Only] Refused to load the script 'https://unpkg.com/gremlins.js' because it violates
 the following Content Security Policy directive: "script-src 'unsafe-inline' 'self' *.fontawesome.com
 *.cloudflare.com *.unpkg.com". Note that 'script-src-elem' was not explicitly set, so 'script-src'
 is used as a fallback.

请问配置的*.unpkg.com为何无法覆盖该场景？

原因分析与解决方案 #

核心原因 #

*.unpkg.com这种通配符规则只匹配unpkg.com的子域名（比如cdn.unpkg.com、test.unpkg.com这类），但不匹配主域名unpkg.com本身。你要加载的脚本正好是主域名下的资源，所以当前CSP规则不生效。

解决办法 #

有两种常见的修正方式：

• 扩展script-src规则，同时包含主域名和所有子域名：

  script-src 'unsafe-inline' 'self' *.fontawesome.com *.cloudflare.com unpkg.com *.unpkg.com;
  

• 如果你只需要加载这一个特定脚本，也可以直接指定完整的源地址：

  script-src 'unsafe-inline' 'self' *.fontawesome.com *.cloudflare.com https://unpkg.com/gremlins.js;
  

内容的提问来源于stack exchange，提问作者Brandon Taylor