我试图显示从本地机器选择的图像，我需要该图像的位置用于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扩展:/ / alplpnakfeabeiebipdmaenpmbgknjce / include.preload.js.map:
HTTP错误:状态代码404,net::ERR_UNKNOWN_URL_SCHEME
对我来说，这些警告是由Selenium IDE Chrome扩展引起的。这些警告出现在控制台中每次页面加载:
DevTools failed to load source map: Could not load content for chrome-extension://mooikfkahbdckldjjndioackbalphokd/assets/atoms.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://mooikfkahbdckldjjndioackbalphokd/assets/polyfills.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://mooikfkahbdckldjjndioackbalphokd/assets/escape.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://mooikfkahbdckldjjndioackbalphokd/assets/playback.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
DevTools failed to load source map: Could not load content for chrome-extension://mooikfkahbdckldjjndioackbalphokd/assets/record.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME
由于Selenium IDE已经设置为能够读取所有站点上的站点数据，所以我卸载了它。(我在这里读到另一个评论，你可以尝试为一个扩展启用更多权限，而不是删除它。)在我的情况下，删除硒IDE (Chrome扩展)摆脱了警告。
在Edge浏览器的控制台中发现大量源映射错误后，我偶然发现了这个Stack Overflow问题。(我想我很久以前就禁用了Chrome浏览器中的警告。)
对我来说，这意味着首先意识到源地图是什么;请参考Macro Mazzon的回答来理解这一点。既然这是个好主意，那么问题就在于如何打开它们。
这就像在webpack.config.js文件中添加这一行一样简单
module.exports = {
devtool: "source-map",
}
现在Edge可以检测到源映射，错误就消失了。
如果这个回答侮辱了任何人的智力，我很抱歉，但也许读到这篇文章的人会像我一样对源地图一无所知。
