javascript - SourceMap 或 X-SourceMap 处理

Question

我无法让 firefox(或与此相关的任何浏览器)识别 X-SourceMap header 。对于我的代码。 //# SourceMappingURL 注释对我来说在浏览器端有效，但由于我系统的特定原因我不能使用它。

我很好奇 X-SourceMap header 在什么条件下用于设置源 map ，因为我似乎没有成功。我认为这与我的代码的获取方式有关——devtools 不知何故没有“意识到”我正在获取一个 javascript 文件，也应该为其获取 sourcemap。

https://hg.mozilla.org/mozilla-central/rev/5a0161f8a11e似乎显示了这是如何实现的，但对于不熟悉此代码库的人来说，不清楚如何确定 X-SourceMap header 的作用。

Answer 1

X-SourceMap已在多个浏览器中检查了 header 支持。

火狐 50.1 supports X-SourceMap仅用于 JavaScript 文件的 header 。 X-SourceMap不支持 CSS 文件的 header 。 SourceMap根本不支持 header 。

Google Chrome 50 和 Chromium 55 DevTools 同时支持 X-SourceMap和 SourceMap JavaScript 和 CSS 的 header 。虽然X-SourceMap header 是 deprecated几年前。

似乎//# sourceMappingURL=<url> annotation 现在得到了浏览器的最大支持。如果文件更改不适用。一个解决方案可能是使用某种 Web 服务器中间件或 mitm 代理将动态源映射注释附加到 Web 服务器响应。例如connect-sourcemaps对于 Node.js 或类似的。