Is it possible to stream-download large files with Vue.js?

Viewed 1587

thanks a bunch in advance.

So, I'm trying to find a solution (googled it, didn't find anything) to stream download. What I mean is, I'm doing an export of data to a csv file, but sometimes the data can be as big as 7MB which is heavy both for my backend and for my user.

I'm writing in Vue Our Backend is written in PHP (Yii 1.1)

This is how I currently download a file

 exportCsv() {
                this.loading = true;
                let payload = this.csvPayload; /// computed property
                this.$http
                    .post("/statistics/apiurl", payload)
                    .then(response => {
                        this.loading = false;
                        const url = window.URL.createObjectURL(new Blob([response.data]));
                        const link = document.createElement('a');
                        link.href = url;
                        link.setAttribute('download', 'excelFile.csv'); //or any other extension
                        document.body.appendChild(link);
                        link.click();
                    })
                    .catch(error => {
                        this.loading = false;
                        this.campaignsLoading = false;
                        console.log("Problem fetching csv file: ", error.message);
                    });
            },

It's great! but again, if the file is really big, It's heavy on the backend and the user.

Like I said, is there a way to stream-download files? or, I thought I could create an observable in a different file that would listen to the data and once its done transmitting send back a callback to my vue component ...

0 Answers
Related