浏览器如何获取源地图?

时间:2015-09-25 19:29:47

标签: javascript source-maps

我想了解源地图的工作原理。我创建了一个简单的Web服务器,其中一个页面使用nodejs。安装了jQuery,它带有缩小版和源映射。然后我在我的网页上添加了一个脚本标记,包括jQuery的缩小版本。我现在可以通过源映射浏览chrome开发人员工具中的未经编辑的代码。但是如何?

我分析从服务器发送的内容,并且不传输源地图。它们未显示在chrome开发人员工具的网络选项卡中,并且不包含在缩小的jquery文件的下载内容中。在缩小的jQuery文件的末尾唯一的是//# sourceMappingURL=jquery.min.map。浏览器如何访问它们?

我有点想知道,因为在我的工作中我正在创建一个应用程序,能够在生产中跟踪源映射的错误会很好。但现在看来,如果我想允许,那也意味着访问该网站的任何人都可以获得未经授权的代码。这是正确的还是可以控制源映射如何从服务器传输到客户端?

修改: 谢谢你的回答。我还自己记录了服务器收到的每个请求。如果使用调试器工具,则源映射是在缩小文件末尾指定的URL处的请求。铬隐藏这一事实使得东西非常混乱。如果我阻止传输源映射,源映射将不起作用,但chrome也将缓存源映射。即如果我允许源地图,查看它,然后阻止它并再次查看源映射可能仍然有效。

2 个答案:

答案 0 :(得分:3)

确实转移了源地图,但在当前版本的Chrome中,它们未显示在“网络”标签中。根据{{​​3}},源地图曾经在“网络”标签上显示,但在某些时候,他们决定对其进行更改,以便不再显示请求。

至于保持源地图的私密性,this answer中提到的解决方案之一是创建一个.htaccess文件,该文件限制从本地网络访问客户端的源地图。另一种方法是设置身份验证,因此您必须登录该站点才能查看源映射,否则您将获得403.

答案 1 :(得分:1)

在这种情况下,浏览器正在请求jquery.min.map文件相对于src元素的<script> URL(“源来源”)。 (而源地图可能会嵌入sourcesContent中的所有来源。)我不确定为什么它不会出现在网络标签中(我以前从未检查过)。在其他情况下,源映射可以完全嵌入脚本中。您可以想象将源文件放在不可公开访问的URL后面,但是对您来说,并相应地设置源映射的sourceRoot属性。在这种情况下,您需要确保源地图不包含sourcesContent