处理步骤
- 从服务返回的字符串中提取文件流数据，可能是Base64或二进制。
- 将数据转换为Blob对象。
- 创建对象URL。
- 创建<a>元素，设置href和download属性。
- 触发点击事件以下载文件。
- 删除缓存数据
代码
// 假设这是从服务返回的Base64字符串（包含MIME类型前缀）
const base64PDF = 'data:application/pdf;base64,JVBERi0xLjQKJd...'; // 你的实际数据
// const base64PDF2 = 'JVBERi0xLjQKJd...'; // 你的实际数据,没有前缀的数据
function downloadPDF(base64Data, fileName) {
// 创建Blob对象
const byteCharacters = atob(base64Data.split(',')[1]);
// const byteCharacters = atob(base64Data2); -- 处理没有前缀的数据
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: 'application/pdf' });
// 创建临时链接
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = fileName || 'document.pdf'; // 设置默认文件名
// 触发下载
document.body.appendChild(link);
link.click();
// 清理资源
document.body.removeChild(link);
URL.revokeObjectURL(link.href);
}
// 使用示例
downloadPDF(base64PDF, 'my_file.pdf');关键点说明：
1数据格式处理：
- 如果返回的是纯Base64字符串（不含MIME类型前缀），需要先添加前缀：
- 不含MIME类型前缀,也可以去掉切割字符串部分
const completeBase64 = 'data:application/pdf;base64,' + yourBase64String;2二进制转换：
- 使用
atob()解码Base64字符串 - 通过
charCodeAt()转换为字节数组 - 使用
Uint8Array创建类型化数组
3文件生成：
- 通过
Blob构造函数创建文件对象 - 使用
URL.createObjectURL()生成临时下载链接
4下载触发：
- 创建虚拟
<a>标签并设置download属性 - 通过
click()事件触发下载
注意事项：
- 确保服务返回的确实是有效的PDF文件流
- 大文件处理建议使用流式处理（本方案适用于中小文件）
- 浏览器兼容性：支持所有现代浏览器（IE11+）
- 文件名编码问题：如果文件名含中文等特殊字符，需要：
link.download = encodeURIComponent(fileName);
扩展建议：
- 如果需要显示PDF预览，可以使用
<iframe>或PDF.js库 - 对于非Base64的二进制流，可以直接使用
new Blob([responseData]) - 添加加载状态提示和错误处理机制
根据你的实际数据格式（Base64/二进制流），选择对应的处理方式即可实现文件下载功能。
