🐛 修复分享页下载文件时页面闪动问题

- 问题:使用window.open()下载文件会导致页面短暂失焦,产生闪动效果
- 修复:改用隐藏的<a>标签触发下载,避免打开新标签页
- 新增triggerDownload()方法处理文件下载
- 影响文件:frontend/share.html (line 744-795)
This commit is contained in:
2025-11-18 18:10:03 +08:00
parent 7d1cb7b506
commit 619b965cf8

View File

@@ -751,7 +751,7 @@
if (file.httpDownloadUrl) {
// 如果配置了HTTP下载URL使用HTTP直接下载
console.log("[分享下载] 使用HTTP下载:", file.httpDownloadUrl);
window.open(file.httpDownloadUrl, '_blank');
this.triggerDownload(file.httpDownloadUrl, file.name);
} else {
// 如果没有配置HTTP URL通过后端SFTP下载
console.log("[分享下载] 使用SFTP下载");
@@ -775,10 +775,25 @@
downloadUrl += `&password=${encodeURIComponent(this.password)}`;
}
window.open(downloadUrl, '_blank');
this.triggerDownload(downloadUrl, file.name);
}
},
// 触发下载使用隐藏的a标签避免页面闪动
triggerDownload(url, filename) {
const link = document.createElement('a');
link.href = url;
link.download = filename || '';
link.style.display = 'none';
document.body.appendChild(link);
link.click();
// 延迟移除,确保下载已触发
setTimeout(() => {
document.body.removeChild(link);
}, 100);
},
getFileIcon(file) {
if (file.isDirectory) return 'fa-folder';
if (file.name.match(/\.(jpg|jpeg|png|gif|bmp|svg)$/i)) return 'fa-file-image';