Javascript 尝试使用jquery从本地目录加载图像

我正在尝试使用jQuery从本地目录加载图像，出现以下错误：

file:///Users/[username]/Desktop/the/pics/Failed to load resource: Failed to load resource: file is directory

我试图使用jquery在一个页面上排列一组图片，大小相同，彼此相邻

我在桌面上有一个索引文件，桌面上还有/pics目录下的image文件夹。索引文件如下所示：

图像
var dir=“the/pics/”；
var fileextension=“.jpeg”；
$.ajax({
网址：dir，
成功：功能（数据）{
$（数据）。查找（“a:包含（+fileextension+））。每个（函数（）{
var filename=this.href.replace（window.location.host“”）.replace（http://“，”）；
$（“正文”）。追加（“”）；
});
}
});
身体{
最大宽度：960像素；
保证金：0自动；
}
.作物{
宽度：200px；
高度：150像素；
溢出：隐藏；
}
.作物img{
宽度：400px；
高度：300px；
利润率：-75px0-100px；
}

当涉及到从javascript处理本地文件时，这里涉及到很多安全手段。例如，您只能从多个文件夹中读取文件（例如，至少在Firefox 55中，您甚至无法访问文件上载浏览器窗口中的%WINDOWS%\Fonts）

当此javascript驻留在本地文件中而不是通过HTTP提供服务的网站中时，这会变得更加严格。这可以防止简单的HTML片段写入磁盘（例如缓存）然后意外或恶意执行的攻击向量

尽管听起来有点违反直觉：驻留在本地html文件中的脚本拥有最少的权限

其中一个原因是，声明只有那些来自同一Web服务器、用于同一域的资源是可信的。（事实上，它说明了更多，包括如何将资源列入白名单等。）

但事实是：硬盘上的每个文件都被视为一个不同的位置，这包括图像文件，因为这些文件可能不属于任何域。这意味着：无法对本地图像进行脚本访问

总而言之，只要正确实施，这是一个相当好的安全措施

在这种情况下，您唯一能做的就是：确保您的脚本（以及它所在的html页面）通过http提供服务。如有必要，使用您的

hosts

-文件添加您需要寻址或设置自己的dns服务器的本地域。

Heyo

出于安全原因，浏览器会阻止它

您可以使用一个简单的python http服务器来拥有一个静态服务器 只需在要提供服务的文件夹中运行这一行

---

python-msimplehttpserver

我建议您阅读一下关于。问题是，出于安全原因，当试图通过javascript访问本地文件时，所有本地文件访问都受到严格限制，特别是从驻留在本地html文件上的脚本调用时。@Psi谢谢，这很有意义！那么我需要一个web服务器来完成这项工作吗？我可以用mamp来做吗？事实上，这是我能想到的唯一解决办法。使用XAMP（包括MAMP）将是最好的解决方案，我想说。@psi或者，如果你已经安装了，你可以使用类似的东西，或者构建你自己的简单服务器或者其他类似的东西。我通常在构建脚本中构建一个简单的服务器进行测试。好的，我应该更清楚地说明：使用Web服务器是我能想到的唯一一组解决方案，而使用XAMP是其中最好的；-）但你是对的，你甚至可以创建一个自己的HTTP服务器来实现这一点。