前端下载多个文件链接整合为压缩包
javascript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<button id="downloadButton">下载</button>
</body>
<script src="https://cdn.jsdelivr.net/npm/jszip@3/dist/jszip.min.js"></script>
<script>
const links = [
'http://39.100.116.85:6001/File/CEcertificateFile/81899821-959d-40d1-ae30-3564a97eedcb_WHOLECE.pdf',
'http://39.100.116.85:6001/File/CEcertificateFile/317b28f1-ceac-434a-b5b7-a5f3b2b258f5_WHOLECE.pdf'
];
function downloadFile(url) {
return new Promise((resolve, reject) => {
fetch(url)
.then(response => response.blob())
.then(blob => resolve(blob))
.catch(error => reject(error));
});
}
document.getElementById('downloadButton').addEventListener('click', async function () {
const zip = new JSZip();
try {
const promises = links.map(async link => {
const fileName = link.substring(link.lastIndexOf('/') + 1);
const fileBlob = await downloadFile(link);
zip.file(fileName, fileBlob);
});
await Promise.all(promises);
zip.generateAsync({ type: 'blob' }).then(content => {
const zipFile = URL.createObjectURL(content);
const a = document.createElement('a');
a.href = zipFile;
a.download = 'files.zip';
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
});
} catch (error) {
console.error('Download failed:', error);
}
});
</script>
</html>