瀏覽器如何獲取源地圖？

Question

我想了解源地圖的工作原理。我使用nodejs創建了一個帶有一個頁面的簡單Web服務器。安裝了一個縮小版本和源地圖的jQuery。然後我在我的網頁上放置了一個腳本標籤，包括jQuery的縮小版本。我現在可以通過源代碼地圖瀏覽Chrome開發人員工具中的未分類代碼。但是如何？

我分析從服務器發送的東西和源地圖不轉移。它們不會顯示在Chrome開發人員工具的網絡選項卡中，並且它們不包含在縮小的jquery文件的下載內容中。在縮小的jQuery文件的最後，唯一的是//# sourceMappingURL=jquery.min.map。瀏覽器如何訪問它們？

我想部分原因是因爲我的工作，我創建一個應用程序，它會是不錯的跟蹤生產與源地圖錯誤的能力。但現在看來，如果我想允許這一點，這也意味着訪問該網站的任何人都可以獲得未分類的代碼。這是正確的還是我可以控制源映射如何從服務器傳輸到客戶端？

編輯： 感謝您的回答。我自己也記錄了服務器收到的每個請求的更多信息。如果使用調試工具，則源映射是在縮小文件末尾指定的URL處的請求。鉻隱藏這一事實使得事情變得非常混亂。如果我阻止源映射被傳輸，源映射將不起作用，但chrome也會緩存源映射。即如果我允許源地圖，查看它，然後阻止它並再次查看源映射可能仍然有效。

Answer 1

來源的地圖確實轉移，但在Chrome的最新版本，他們不會在網絡選項卡中顯示。根據this answer，源映射曾用於在「網絡」選項卡上可見，但在某些時候他們決定對其進行更改，以便請求不再可見。

至於保持您的源地圖是私人的，this answer中提到的解決方案之一是創建一個.htaccess文件，該文件限制從本地網絡訪問客戶端的源地圖。另一種方式來做到這一點。將設置身份驗證，所以你必須登錄到該網站才能夠查看源代碼的地圖，否則你會得到一個403

Answer 2

在這種情況下，瀏覽器正在請求jquery.min.map文件相對於<script>元素（「源來源」）的src URL。 （和源地圖可能嵌入所有的sourcesContent來源。）我不知道爲什麼它不會在網絡選項卡（我以前從來沒有檢查）顯示。在其他情況下，源地圖可以完全嵌入到腳本中。你當然可以把源文件是不能公開訪問，但對你的URL後面，並設置相應的源地圖的sourceRoot財產。在這種情況下，你要確保你的源地圖不包括sourcesContent