I'm writing a web application that runs on an iPad, but I've found that Chrome iOS has a download issue.
You can download it by adding a Chrome iOS specific process like code, but the filename is always document
. This issue seems to be due to Chrome iOS not supporting the download attribute of anchor tags, is there a workaround?
const saveCsvFile = (response: AxiosResponse<any>) => {
const tmp = response.headers['content-disposition'].replace((/attachment; filename\*=UTF-8''(.*)/u), '$1')
const fileName = decodeURIComponent(tmp)
if (navigator.userAgent.match('CriOS')) { // iOS Chrome
const blob = new Blob([response.data])
const reader = new FileReader()
reader.onloadend = () => {
const a = document.createElement('a')
document.body.appendChild(a)
a.download = fileName
a.href = reader.result as string
a.click()
a.remove()
}
reader.readAsDataURL(blob)
} else { // Other browser
const fileURL = window.URL.createObjectURL(new Blob([response.data]))
const a = document.createElement('a')
document.body.appendChild(a)
a.download = fileName
a.href = fileURL
a.click()
a.remove()
window.setTimeout(() => {
window.URL.revokeObjectURL(fileURL)
}, 1000)
}
}