vue axios post 下载excel文件

2020-03-25  本文已影响0人  who_are_you_

废话不说,实测有用。

直接这样写的话不需要注意什么。还有一种方法,以后补上,这里的步骤一步也不能少。

method: {
// 请求事件
    Ev(){
        let options = {uid: this.value};
            return new Promise((resolve, reject) => {
                console.log(JSON.stringify(options));
                axios.defaults.headers['content-type'] = 'application/vnd.ms-excel;charset=UTF-8';
                axios({
                    method: 'get',
                    url: 'http://10.com', // 请求地址
                    params: options, // 参数
                    responseType: 'blob' // 表明返回服务器返回的数据类型
                }).then(
                    response => {
                        resolve(response.data);
                        console.log(response.data);
                        console.log(response);
                        let blob = new Blob([response.data], {
                            type: 'application/vnd.ms-excel'
                        });
                        console.log(blob);
                      // 获取后台返回到headers中的filename
                        let temp = response.headers['content-disposition'].split(';')[1].split('filename=')[1];
                        console.log(temp);
                        let fileName = temp;
                      // 解决兼容问题
                        if (window.navigator.msSaveOrOpenBlob) {
                            console.log(2);
                            navigator.msSaveBlob(blob, fileName);
                        } else {
                            console.log(3);
                            let link = document.createElement('a');
                            // 我用的这个时间段URL.createObjectURL()已经不能用了,这里需要解决一下兼容问题
                            link.href = this.createObjectURL(blob);
                            console.log(this.createObjectURL(blob));
                            link.download = fileName;
                            link.click();
                            // 释放内存
                            // this.revokeObjectURL(link.href);
                        }
                    },
                    err => {
                        reject(err);
                    }
                );
            });
    },
createObjectURL(object) {
            return (window.URL) ? window.URL.createObjectURL(object) : window.webkitURL.createObjectURL(object);
        }

上一篇 下一篇

猜你喜欢

热点阅读