在这个数字时代,文件下载无处不在。借助 Ajax 的功能,我们可以通过允许异步文件下载而不中断网页交互来增强用户体验。
问题
对服务器端文件使用 Struts2 操作时下载,通过 jQuery 调用操作检索二进制流中的数据。然而,期望的结果是触发一个文件保存对话框,允许用户在本地保存文件。
现代浏览器解决方案
对于现代浏览器,以下方法是推荐:
<br>fetch('your-download-endpoint').then(resp => resp.blob()).then(blob => {<br> const url = window.URL.createObjectURL(blob);<br> const a = document.createElement('a');<br> a.style.display = 'none';<br> a.href = url;<br> a.download = '您的文件名'; //指定所需的文件名<br> document.body.appendChild(a);<br> a.click();<br> window.URL.revokeObjectURL(url);<br>});<br>
此代码为 blob 数据创建一个临时 URL,然后将其附加到附加到文档正文的锚元素。单击此隐藏的锚元素会触发文件保存对话框,下载完成后,临时 URL 将被撤销。
注意事项
虽然此方法适用于对于中小型文件,重要的是要考虑非常大的下载的内存消耗。如果您预计文件很大,那么使用 iframe 和 cookie 等替代技术可能更合适。
以上是Ajax 如何异步触发文件保存对话框以增强用户体验?的详细内容。更多信息请关注PHP中文网其他相关文章!