“不允许加载本地资源：file:///C:..jpg” Java EE Tomcat

Posted 2023-02-19

【中文标题】“不允许加载本地资源：file:///C:..jpg” Java EE Tomcat

【英文标题】："Not allowed to load local resource: file:///C:....jpg" Java EE Tomcat

【发布时间】：2014-07-21 02:52:48

【问题描述】：

我正在尝试在良好存储后从我的文件系统中检索图片，（而不是将其放入数据库中，我将其复制到磁盘并将路径放入数据库）

我已将图片存储到 c:\images\ 文件夹，并假设完整路径的名称为 c:\images\mypic.jpg 当我尝试检索它时，使用一些 java 代码将 img src 属性设置为 <img src="c:\images\mypic.jps"> 在浏览器控制台我发现了这个错误Not allowed to load local resource: file:///C://images//mypic.jpg

问题：如何解决这些路径问题？我应该在哪里存储图片？我应该从哪里检索它们？

【参考方案1】：

你有两种选择：

第一个是创建一个 ServletImageLoader，它将图像的标识符（图像的路径或哈希）作为参数，您将在 Servlet 中使用该标识符来处理您的图像，并将打印到响应中从服务器流式传输加载的图像。

第二个是在应用程序的 ROOT 文件夹中创建一个文件夹，并保存图像的相对路径。

【讨论】：

我认为第二个很好，请你解释一下如何？ -我的意思是在哪里可以找到我的应用程序的根？ - 将图片放在那里的路径是什么？ - 检索的路径是什么？

【参考方案2】：

http 位置和磁盘位置的概念是不同的。你需要做的是：

上传文件summer.jpg 将已知（应用程序）位置下的内容移动到磁盘，例如c:\images\summer.jpg 插入代表带有文本summer.jpg的图像的数据库记录 显示它使用纯<img src="images/summer.jpg" /> 您需要在您的应用程序的/images 下为c:\images\ 提供服务的东西（例如apache）。如果你不能这样做，那么在第 2 步中，你需要保存在你的 web 根目录下的某个地方，例如 c:\my-applications\demo-app\build\images

【讨论】：

你可以用 apache 和 Alias 来做，或者你可以用 tomcat（或你使用的任何容器）和 ServletImageLoader 来做，就像 Mifmif 说的那样。

能否请您澄清 Alias 方法，因为我使用的是 zk 框架，我认为无法使用 servletImageLoader

谷歌：apache alias 第一个想法。

【参考方案3】：

许多浏览器已更改其安全策略，不再允许直接从文件共享甚至本地资源读取数据。您需要将文件放置在您的 tomcat 实例可以为它们提供服务的地方，并在您生成的 html 中放置一个“常规”http url。这可以通过提供一个 servlet 来完成，该 servlet 读取并提供文件，将文件放入目录中，tomcat 将在该目录中将其作为“静态”内容提供。

【参考方案4】：

发送标签<img src="c:\images\mypic.jpg"> 会导致用户浏览器从他的文件系统访问图像。 如果您必须将图像存储在位于c:\images 的文件夹中，我建议创建一个像 images.jsp 这样的 servlet，它作为参数采用文件名，然后将 servlet 响应内容设置为图像/jpg，然后加载字节来自服务器位置的图像并将其放入响应中。

但是您使用什么来创建您的应用程序？它是纯servlet吗？春天？ JSF？

Here你可以找到一些关于如何做的信息。

【讨论】：

帮不了你。我还没有使用它。但是环顾四周，我相信你会找到一个关于通过 zk 框架发送图像内容的教程。附言您应该能够在您的应用程序中编写具有该功能的纯 servlet 方法

【参考方案5】：

在 Chrome 中，您应该能够通过运行时标志 --allow-file-access-from-files 来允许此功能

但是，当前版本的 Chrome (37、38) 似乎存在问题，除非您还传递运行时标志 --disable-web-security

这是一个不可接受的解决方案，除了可能是一种短期解决方法，但它已被确定为一个问题： https://code.google.com/p/chromium/issues/detail?id=379206

【讨论】：

不仅在 chrome 中，其他浏览器（例如 Mozilla 和 Edge for MS）都不提供图像。我正在做一个 WordPress 项目，我得到了同样的不允许加载图像错误。

--allow-file-access-from-files 和 --disable-web-security 两个标志都不再起作用了。

【参考方案6】：

此错误意味着您无法直接从文件系统加载数据，因为这背后存在安全问题。我知道的唯一解决方案是创建一个 Web 服务来提供加载文件。

【讨论】：

我使用的是 apache 服务器，但仍然无法正常工作。

【参考方案7】：

不要使用绝对路径来引用图像的名称，例如：C:/xamp/www/Archivos/images/templatemo_image_02_opt_20160401-1244.jpg。您必须在网络服务器中使用对其位置的引用。例如使用../../Archivos/images/templatemo_image_02_opt_20160401-1244.jpg，具体取决于您的进程在哪里运行。

【参考方案8】：

如果您只想在本地运行此应用程序并且安全不是问题，这里有一个简单的expressjs 解决方案：

在您的 server.js 或 app.js 文件中，添加以下内容：

app.use('/local-files', express.static('/'));

这将为您在/local-files 下的整个根目录提供服务。不用说，如果您打算将此应用程序部署在本地计算机以外的任何地方，那么这是一个非常糟糕的主意。

现在，您可以这样做：

<img src="/local-files/images/mypic.jps"/> 

注意：我正在运行 macOS。如果您使用的是 Windows，您可能需要从路径字符串中搜索并删除 'C:\'