如何根据 API 响应触发下载？

Question

我打电话给 API 来获取 QR 码，我得到了回复并且能够在 DOM 上显示它作为用户选择的任何类型，但现在我需要下载它

我试过了

axios
    .post(window.URL, body, { responseType: 'arraybuffer' })
    .then((response) => {
        console.log('get-serial', response.data)

        const base64 = btoa(new Uint8Array(response.data).reduce((data, byte) => data + String.fromCharCode(byte), ''))

        //download
        var img = new Image()
        img.src = 'data:image/jpeg;base64, ' + base64
        return img
    })
    .catch((err) => {
        console.log('Something went wrong: ', err)
    })

运行时我没有看到任何图片下载。

Answer 1

这非常有效；

axios
    .post(window.URL, body, { responseType: 'arraybuffer' })
    .then((response) => {
        const url = window.URL.createObjectURL(new Blob([response.data]))
        const link = document.createElement('a')
        link.href = url
        link.setAttribute('download',  'filename.ext')
        document.body.appendChild(link)
        link.click()
    })

如何根据 API 响应触发下载？

How can I trigger download base on API response?

image

vue.js

vue-component

vuejs2

vuetify.js