🐛 修复分享页下载文件时页面闪动问题
- 问题:使用window.open()下载文件会导致页面短暂失焦,产生闪动效果 - 修复:改用隐藏的<a>标签触发下载,避免打开新标签页 - 新增triggerDownload()方法处理文件下载 - 影响文件:frontend/share.html (line 744-795)
This commit is contained in:
@@ -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';
|
||||
|
||||
Reference in New Issue
Block a user