前端:pdf预览地址打开后,直接进行下载pdf
xhr.open('GET', ' *****请求地址****** ');// 创建一个 Blob 对象,用于存储响应数据。// 创建一个 XMLHttpRequest 对象。// 创建一个隐藏的 <a> 标签。// 将 <a> 标签添加到页面中。// 设置下载文件的名称(可选)// 当请求完成时执行的回调函数。// 设置响应类型为二进制数据。// 触发点击事件进行下载。// 移除 <a> 标签。
以vue3作为示例
<template>
<div>
<button @click="downloadPDF">下载 PDF</button>
</div>
</template>
<script setup lang="ts">
const downloadPDF = () => {
// 创建一个 XMLHttpRequest 对象
const xhr = new XMLHttpRequest();
// 设置请求的 URL
xhr.open('GET', ' *****请求地址****** ');
// 设置响应类型为二进制数据
xhr.responseType = 'blob';
// 当请求完成时执行的回调函数
xhr.onload = () => {
// 创建一个隐藏的 <a> 标签
const link = document.createElement('a');
link.style.display = 'none';
// 创建一个 Blob 对象,用于存储响应数据
const blob = new Blob([xhr.response], { type: 'application/pdf' });
// 设置下载链接
link.href = URL.createObjectURL(blob);
// 设置下载文件的名称(可选)
link.download = 'filename.pdf';
// 将 <a> 标签添加到页面中
document.body.appendChild(link);
// 触发点击事件进行下载
link.click();
// 移除 <a> 标签
document.body.removeChild(link);
};
// 发送请求
xhr.send();
};
</script>
更多推荐
所有评论(0)