错误消息“DevTools 无法加载 SourceMap：无法加载
我正在尝试显示从本地计算机中选择的图像，并且我需要该图像的位置以用于 JavaScript 函数。但我无法获得位置。
为了获取图像位置，我尝试使用console.log，但没有返回。
console.log(document.getElementById("uploadPreview"));
这是HTML代码：
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div align="center" style="padding-top: 50px">
<img align="center" id="uploadPreview" style="width: 100px; height: 100px;" />
</div>
<div align="center" style="padding-left: 30px">
<input id="uploadImage" type="file" name="myPhoto" onchange="PreviewImage();" />
</div>
<script type="text/javascript">
function PreviewImage() {
var oFReader = new FileReader();
oFReader.readAsDataURL(document.getElementById("uploadImage").files[0]);
oFReader.onload = function (oFREvent) {
document.getElementById("uploadPreview").src = oFREvent.target.result;
console.log(document.getElementById("uploadPreview").src);
};
}
</script>
</body>
</html>
控制台输出：
这是警告：
DevTools 无法加载 SourceMap：无法加载 chrome-extension://alplpnakfeabeiebipdmaenpmbgknjce/include.preload.js.map 的内容：HTTP 错误：状态码 404，net::ERR_UNKNOWN_URL_SCHEME
繁星淼淼4回答
-
心有法竹
那是因为 Chrome 添加了对源映射的支持。转到开发人员工具（F12在浏览器中），然后选择右上角的三个点，然后转到Settings。然后，查找Sources并禁用选项：“启用 JavaScript 源映射”“启用 CSS 源映射”如果你这样做，那将摆脱警告。它与您的代码无关。检查其他页面中的开发人员工具，您将看到相同的警告。 -
饮歌长啸
转到开发人员工具→设置→控制台→ 勾选“仅限选定上下文”。警告将被隐藏。您可以通过取消选中同一个框再次看到它们。“仅选定上下文”仅表示顶部、iframe、工作者和扩展上下文。在绝大多数情况下，这就是您所需要的。 -
繁星点点滴滴
include.prepload.js文件将有如下一行，可能是最后一行：//# sourceMappingURL=include.prepload.js.map删除它，错误就会消失。 -
慕盖茨4494581
在Edge浏览器的控制台中发现大量源映射错误后，我偶然发现了这个 Stack Overflow 问题。（我想我很久以前就禁用了 Chrome 浏览器中的警告。）对我来说，这意味着首先要了解源地图是什么；请参阅Macro Mazzon 的回答以了解这一点。由于这是一个好主意，所以这只是找出如何打开它们的一个案例。就像在webpack.config.js文件中添加这一行一样简单-module.exports = { devtool: "source-map",}现在 Edge 可以检测到源地图，错误就消失了。如果这个答案侮辱了任何人的智商，我深表歉意，但也许读到这篇文章的人会像我一样对源地图一无所知。
随时随地看视频慕课网APP
相关分类
JavaScript