下载oss链接文件,并修改文件名称
·
如果想要修改oss链接文件的文件名,需要后端进行修改配置,如果前端想要实现动态实现下载文件并修改名功能时。
首先需要将改文件下载到本地,然后再将改文件进行二进制编码,然后再生成一个链接,最后再实现下载和修改文件功能。
downloadRatTemplate: async (row: any) => {
try {
const { data } = await downloadRatingScoreTemplate({
questionnaireConfigId: row.questionnaireConfigId
})
const { url, filename } = data
// 1. 请求OSS文件二进制数据(arraybuffer格式)
const response = await fetch(url)
if (!response.ok) {
throw new Error(`请求失败,状态码: ${response.status}`)
}
// 2. 获取二进制数据(arraybuffer)
const arrayBuffer = await response.arrayBuffer()
// 3. (可选)二进制转Base64编码(如需处理编码,否则可跳过此步)
const base64Str = btoa(new Uint8Array(arrayBuffer).reduce((data, byte) => data + String.fromCharCode(byte), ""))
// 4. 将Base64解码回二进制(或直接使用原始arraybuffer)
// 方式A:使用Base64解码(适用于需要先编码的场景)
const binaryStr = atob(base64Str)
const length = binaryStr.length
const uint8Array = new Uint8Array(length)
for (let i = 0; i < length; i++) {
uint8Array[i] = binaryStr.charCodeAt(i)
}
const blob = new Blob([uint8Array], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" })
// 方式B:直接使用原始arraybuffer(无需编码时更高效)
// const blob = new Blob([arrayBuffer], { type: mimeType });
// 5. 创建下载链接并触发下载
const url1 = URL.createObjectURL(blob)
const link = document.createElement("a")
console.log("url1url1", url1)
link.href = url1
link.download = filename // 自定义文件名
link.style.display = "none"
document.body.appendChild(link)
link.click()
// 6. 清理资源
document.body.removeChild(link)
URL.revokeObjectURL(url1) // 释放Blob URL资源
} catch (error) {
console.log(error)
}
},
更多推荐


所有评论(0)