js 执行下载

在JavaScript中实现文件下载通常涉及到创建一个隐藏的<a>元素，并设置其href属性为文件的URL或数据URI，然后模拟点击该元素来触发下载。以下是几种常见的实现方式：

1. 下载外部文件

如果你想让用户下载一个外部文件，可以直接设置<a>元素的href属性为文件的URL，并添加download属性来指定下载后的文件名。

function downloadFile(url, filename) {
    const a = document.createElement('a');
    a.href = url;
    a.download = filename || 'download';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
}

// 使用示例
downloadFile('https://example.com/path/to/file.pdf', 'myfile.pdf');

2. 下载由JavaScript生成的内容

如果你需要下载由JavaScript动态生成的内容（如文本、JSON、图片等），可以先将这些内容转换为Blob对象，然后创建一个指向该Blob的URL。

function downloadBlob(content, mimeType, filename) {
    const blob = new Blob([content], { type: mimeType });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = filename || 'download';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    URL.revokeObjectURL(url); // 释放URL对象
}

// 使用示例：下载JSON数据
const data = { key: 'value' };
downloadBlob(JSON.stringify(data), 'application/json', 'data.json');

3. 使用Fetch API下载文件

你还可以使用Fetch API来获取文件数据，然后将其转换为Blob对象并触发下载。

async function fetchAndDownload(url, filename) {
    const response = await fetch(url);
    if (!response.ok) throw new Error('Network response was not ok');
    const blob = await response.blob();
    const downloadUrl = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = downloadUrl;
    a.download = filename || 'download';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    URL.revokeObjectURL(downloadUrl);
}

// 使用示例
fetchAndDownload('https://example.com/path/to/file.jpg', 'myimage.jpg');