英文:
Vaadin 24 file-download-wrapper component
问题
我需要通过 Vaadin Flow 24 应用程序中的按钮点击下载文件。为此，我安装了 https://vaadin.com/directory/component/file-download-wrapper 辅助插件。
在桌面浏览器上一切正常，但当我使用 iPhone 时，在视图上单击下载按钮，比如说在以下页面：
https://example.com/products/02c898e8-4239-4153-9bf5-30faa0bb2a25
为了下载 PDF 文件。之后，我成功地在屏幕上看到了 PDF 文件。但问题是页面的 URL 现在已更改为：
https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf
这是我不希望看到的。当我尝试将下载的文件分享给另一个用户时，我注意到了这一点。我发送给用户的是 URL https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf 而不是文件。
这里最大的问题是页面 https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf 并不存在，这会让用户感到困惑。他们将分享这些“无效”的链接。
这在 iPhone 上是正确的行为吗？如果不是，我做错了什么？是否有可能在这种情况下改善用户体验，而不向他们显示这样的 URL https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf？
这是代码：
Button button = new Button("Download file");
FileDownloadWrapper wrapper = new FileDownloadWrapper(
new StreamResource("product.pdf", () -> {
try {
return productService.generateFileInputStream();
} catch (IOException e) {
throw new RuntimeException(e);
}
}));
wrapper.wrapComponent(button);
layout.add(wrapper);
英文:
I need to download a file by Button click in Vaadin Flow 24 application. For this purpose, I installed https://vaadin.com/directory/component/file-download-wrapper helper add-on.
Everything works fine on desktop browser but when I use my iPhone, I click the download button on the View, let's say on the following page:
https://example.com/products/02c898e8-4239-4153-9bf5-30faa0bb2a25
in order to download a PDF file. After that, I successfully see the PDF file on the screen. But the issue is that the URL of the page is changed now to:
https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf
which is something that I don't expect. I noticed this when I tried to share the download file to another user. Instead of the file, I sent to this user the URL https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf
The biggest issue here is that the page https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf doesn't exists and this will confuse the user. They will share the "dead" urls.
Is this a correct behavior on iPhone and if no, what am I doing wrong? Is it possible to somehow improve the user experience in this case and not show them such a URL https://example.com/VAADIN/dynamic/resource/3/55c74517-4ac0-42ca-81fe-0a3e62ff3bca/product.pdf ?
This is the code:
Button button= new Button("Download file");
FileDownloadWrapper wrapper= new FileDownloadWrapper(
new StreamResource("product.pdf", () -> {
try {
return productService.generateFileInputStream();
} catch (IOException e) {
throw new RuntimeException(e);
}
}));
wrapper.wrapComponent(button);
layout.add(wrapper);
答案1
得分: 4
Stream resources / dynamic URLs are UI based and can't be shared. When a legitimate use case of your users is to share dynamically created files, you have to use e.g. a spring controller or servlet to serve them and just use an Anchor on Vaadin that links to that particular resource. Make sure to apply proper security to that endpoint / or not if it's allowed to be accessed by anyone.
英文:
Stream resources / dynamic URLs are UI based and can't be shared. When a legitimate use case of your users is to share dynamically created files, you have to use e.g. a spring controller or servlet to serve them and just use an Anchor on Vaadin that links to that particular resource. Make sure to apply proper security to that endpoint / or not if it's allowed to be accessed by anyone.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论