js下载文件，并防止浏览器直接打开文件

JS下载PDF文件时，浏览器默认会直接打开，下面我封装了下载方法，直接调用downloadFileByUrl(文件地址)，即可下载文件。

/**
 * 获取文件流
 * @param url 文件地址
 * @param method 请求方法
 */
const getBlob = (url:string,method = "GET") => {
    return new Promise((resolve) => {
        var xhr = new XMLHttpRequest()
        xhr.open(method, url, true)
        xhr.responseType = 'blob'
        xhr.onload = () => {
            if (xhr.status === 200) {
                resolve(xhr.response)
            }
        }

        xhr.send()
    })
}

/**
 * 保存文件
 * @param blob 文件流
 * @param filename 文件名称
 */
const saveAs = (blob:any, filename:string) => {
    const nav = (window.navigator as any)
    if (nav.msSaveOrOpenBlob) {
        nav.msSaveBlob(blob, filename)
    } else {
        const link = document.createElement('a')
        const body = document.querySelector('body')

        link.href = window.URL.createObjectURL(blob) // 创建对象url
        link.download = filename

        // fix Firefox
        link.style.display = 'none'
        body?.appendChild(link)

        link.click()
        body?.removeChild(link)

        window.URL.revokeObjectURL(link.href) // 通过调用 URL.createObjectURL() 创建的 URL 对象
    }
}

/**
 * 下载文件
 * @param url 文件地址
 * @param filename 文件名称
 * @param method 请求方法
 */
export const downloadFileByUrl = (url:string, filename = '',method = "GET") => {
    getBlob(url,method).then((blob) => {
        saveAs(blob, filename)
    })
}