如果 html 文件是本地的（在我的 C 驱动器上），它可以工作，但如果 html 文件在服务器上并且图像文件是本地的，则不能。这是为什么呢？
任何可能的解决方法？
【问题讨论】：
src=""
如果客户端可以请求本地文件系统文件，然后使用 JavaScript 找出其中的内容，这将是一个安全漏洞。
解决此问题的唯一方法是在浏览器中构建扩展。 Firefox 扩展和 IE 扩展可以访问本地资源。 Chrome 的限制要严格得多。
【讨论】：
您不应该使用“file://C:/localfile.jpg”而不是“C:/localfile.jpg”吗？
【讨论】：
file:///localfile.jpg 对于 linux 来说是正确的
除非您访问的是本地 html 页面，否则不允许浏览器访问本地文件系统。您必须在某处上传图像。如果与html文件在同一目录下，则可以使用<img src="localfile.jpg"/>
【讨论】：
C: 不是公认的 URI 方案。请改用file://c|/...。
【讨论】：
老实说，最简单的方法是将文件托管添加到服务器。
打开 IIS
在默认网站下添加虚拟目录
在 C: 驱动器上为“NETWORK SERVICE”和“IIS AppPool\DefaultAppPool”的文件夹添加适当的权限
刷新默认网站
你已经完成了。您现在可以通过导航到 http://yourServerName/whateverYourFolderNameIs/yourImage.jpg 浏览到该文件夹中的任何图像，并在您的 img src 中使用该 url
希望这对某人有所帮助
【讨论】：
IE 9：如果您希望用户在将图像发布到服务器之前查看图像： 用户应将该网站添加到“受信任的网站列表”中。
【讨论】：
我们可以使用 javascript 的 FileReader() 和它的 readAsDataURL(fileContent) 函数来显示本地驱动器/文件夹文件。 将更改事件绑定到图像，然后调用 javascript 的 showpreview 函数。 试试这个 -
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;'>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
<title></title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
function showpreview(e) {
var reader = new FileReader();
reader.onload = function (e) {
$("#previewImage").attr("src", e.target.result);
}
//Imagepath.files[0] is blob type
reader.readAsDataURL(e.files[0]);
}
</script>
</head>
<body >
<div>
<input type="file" name="fileupload" value="fileupload" id="fileupload" onchange='showpreview(this)'>
</div>
<div>
</div>
<div>
<img width="50%" id="previewImage">
</div>
</body>
</html>
【讨论】：
抛开 Newtang 对安全规则的观察，您如何知道查看您页面的任何人都会在c:\localfile.jpg 获得正确的图像？你不能。即使你认为你可以，你也不能。一方面，它以 Windows 环境为前提。
【讨论】：
如果你使用谷歌 chrome 浏览器，你可以这样使用
<img src="E://bulbpro/pic_bulboff.gif" width="150px" height="200px">
但如果你使用 Mozila Firefox，你需要添加“文件” ex.
<img src="file:E://bulbpro/pic_bulboff.gif" width="150px" height="200px">
【讨论】：
我认为您正在尝试做的事情有两种可能性：
您希望在服务器上运行的网页在您最初设计的计算机上找到文件吗？
您希望它从正在查看页面的电脑上获取它吗？
选项 1 没有意义 :)
选项 2 将是一个安全漏洞，浏览器禁止网页（从网络提供）在查看者的机器上加载内容。
Kyle Hudson 告诉了你你需要做什么，但这太基础了，我很难相信这就是你想做的全部。
【讨论】：
如果您只是为自己或某些客户部署本地网站，您可以通过在 cmd 中以管理员身份在网站根目录中运行 mklink /D MyImages "C:/MyImages" 来解决此问题。然后在html中，做<img src="MyImages/whatever.jpg">，mklink建立的符号链接会将相对的src链接和你C盘上的链接连接起来。它为我解决了这个问题，所以它可以帮助其他提出这个问题的人。
（显然这不适用于公共网站，因为您不能轻松地在人们的计算机上运行 cmd 命令）
【讨论】：
我尝试了很多技术，终于在C#端和JS端找到了一个。 您不能提供 src 属性的物理路径，但可以将 base64 字符串作为 src 提供给 Img 标记。 让我们看看下面的 C# 代码示例。
<asp:Image ID="imgEvid" src="#" runat="server" Height="99px"/>
C#代码
if (File.Exists(filepath)
{
byte[] imageArray = System.IO.File.ReadAllBytes(filepath);
string base64ImageRepresentation = Convert.ToBase64String(imageArray);
var val = $"data: image/png; base64,{base64ImageRepresentation}";
imgEvid.Attributes.Add("src", val);
}
希望这会有所帮助
【讨论】：
以file:/// 开头并以filename 结尾应该可以工作：
<img src="file:///C:/Users/91860/Desktop/snow.jpg" alt="Snow" style="width:100%;">
【讨论】：
您还需要上传图片，然后链接到服务器上的图片。
【讨论】：
让图像成为用户选择的东西怎么样？使用 input:file 标签，然后在他们选择图像后，将其显示在客户端网页上？这对大多数事情都是可行的。现在我正试图让它在 IE 上工作，但与所有微软产品一样，它是一个集群 fork()。
【讨论】：