使用子文件夹时,Discourse_docker (blocked:csp) 出现 svg-sprite 错误

我们确实已经为子文件夹场景中的 SVG 精灵图准备了所有逻辑,并且已有多个站点成功应用。但在这种情况下,我们遇到了一个非常特定的边缘情况。检查 @vkozyrev 站点(在浏览器控制台中)的关键变量:

> Discourse.SvgSpritePath
"/svg-sprite/sales-community-staging.rainmakers.co/svg-2-8ed106e6e3d908b1b86898dfe93a7bac0fd358f4.js"
> Discourse.BaseUri
"/sales-community"

看起来没问题。接下来,当我们加载 SVG 精灵图时,会使用 loadScript,它会调用 Discourse.getURL。该函数负责添加子文件夹前缀。尝试一下:

> Discourse.getURL(Discourse.SvgSpritePath)
"/svg-sprite/sales-community-staging.rainmakers.co/svg-2-8ed106e6e3d908b1b86898dfe93a7bac0fd358f4.js"

咦……这似乎没有产生任何效果。而另一个随机 URL 则正常工作:

> Discourse.getURL("/blah")
"/sales-community/blah"

进一步深入调查后,发现了 getUrl 函数中的 这一行代码

if (url.indexOf(Discourse.BaseUri) !== -1) return url;

用中文来说就是:“如果 URL 已经包含子文件夹前缀,就放弃处理。”因此,这里的问题是 @vkozyrev 的子文件夹前缀(/sales-community)被包含在了 SVG 精灵图 URL 的中间部分:

/svg-sprite/sales-community-staging.rainmakers.co/svg-2-8ed106e6e3d908b1b86898dfe93a7bac0fd358f4.js

我已经让该检查更加具体,现在它只检查子文件夹前缀是否出现在 URL 的开头

不过,这也让我想到其他潜在的问题……例如,如果有人希望将子文件夹前缀设置为 /t/about,或者是我们在 Discourse 中使用的任何其他 URL:thinking:

10 个赞