嵌入SVG的JavaScript在不同URL执行差异及启用方法咨询

问题原因 #

GitHub的Raw文件服务会给SVG资源添加严格的**内容安全策略（CSP）**和安全头部，直接阻止了SVG内部的JavaScript代码执行——而火焰图的点击交互正是靠这些脚本实现的。对比之下，brendangregg的网站没有这类限制，所以脚本能正常运行，条形可点击。

可行解决方案 #

• 下载本地打开：直接把GitHub Raw链接里的SVG文件下载到本地，用浏览器打开本地文件即可。本地文件不受远程服务器的CSP限制，脚本能正常执行，交互功能就恢复了。
• 用GitHub Pages托管：把SVG文件放到GitHub仓库的gh-pages分支，或者在仓库设置里开启GitHub Pages功能。通过GitHub Pages的域名访问SVG时，安全策略会放宽，脚本可以正常运行，就能点击条形了。
• 嵌入到HTML页面：写一个简单的HTML文件，用<object data="你的SVG链接" type="image/svg+xml"></object>标签把SVG嵌入进去，然后打开这个HTML文件（本地或部署到自己的服务器）。HTML环境不会限制SVG内的脚本执行，交互功能就能正常使用。
• 临时关闭浏览器安全限制（不推荐）：比如Chrome可以用--disable-web-security --user-data-dir="临时目录"的启动参数关闭安全策略，但这会降低浏览器的安全性，只适合临时测试使用。

内容的提问来源于stack exchange，提问作者Brian Yeh