与Vaadin 14一起展示的图片

Question

我写这篇文章是因为我需要一些帮助。根据应用程序中的特定路径，我在显示图像时遇到问题。

基本上它在做什么：我有一个名为Sector的模块，每个Sector都可以有一个与其相关的图像。当我使用Vaadin的Upload组件时，我会将图像的路径保存到数据库中的一个表中，这样它就可以显示之前选择的图片。

图像的实际路径很奇怪，似乎Vaadin将图像复制到了一个动态随机文件夹中。它不能使用图像的实际路径，这似乎是合乎逻辑的。

但问题是：路径在数据库中输入得很好，但当我重新加载页面(F5(时，Vaadin无法再显示图像。这让我很不安，因为它应该显示得很好。

Vaadin用上传的图像创建的路径：Vaadin/dynamic/resource/2/c1ef7b9d-8f2b-4354-a97e-fe1fd4e868e7/551434.jpg

如果有帮助的话，我可以放一些代码。

屏幕截图显示了我刷新浏览器页面后它在做什么。

图像正在上传

刷新页面后

以下是我处理上传图像的代码部分：

upload.addSucceededListener(e -> {
Component component = createComponent(e.getMIMEType(),
e.getFileName(), buffer.getInputStream());
showOutput(e.getFileName(), component, output);
//imgUpload = (Image) component;
InputStream inputStream = buffer.getInputStream();
targetFile = new File(PATH + currentProjetId + "\secteur" + currentSecId + "\photoSec.png");
try {
FileUtils.copyInputStreamToFile(inputStream, targetFile);
} catch (IOException e1) {
e1.printStackTrace();
Notification.show("Error");
}
System.out.println("PATH : " + targetFile.getPath());
});

Answer 1

我认为您使用的是刷新视图时丢弃的内存中资源。您必须获取文件的内容，并将其保存在服务器文件系统目录中的文件中。这里有一个例子：

FileBuffer receiver = new FileBuffer();
Upload upload = new Upload(receiver);
upload.setAcceptedFileTypes("text/plain");
upload.addSucceededListener(event -> {
try {
InputStream in = receiver.getInputStream();
File tempFile = receiver.getFileData().getFile();
File destFile = new File("/some/directory/" + event.getFileName());
FileUtils.moveFile(tempFile, destFile);

} catch (IOException e) {
e.printStackTrace();
Notification.show("Error").
}
});