Generate file download from vue.js

Question

I have retrieved some data from websocket server, is is possible to generate a file download event so that the user can save arbitrary data to disk?

Normally people would access a new URL to export data, I'm trying to avoid that.

Hi, maybe you can send data over socket as buffer, and then on frontend convert it to file — Loki, Nov 01 '19 at 09:44
Does this answer your question? [How to create a file in memory for user to download, but not through server?](https://stackoverflow.com/questions/3665115/how-to-create-a-file-in-memory-for-user-to-download-but-not-through-server) — Decade Moon, Nov 01 '19 at 10:32

score 1 · Answer 1 · answered Oct 02 '20 at 19:50

To create a file in memory using vue.js you can use the example below:

<div id="app">
  <a v-on:click="download()" :href="myUrl" :download="myfilename">DOWNLOAD</a>
</div>

<script>
 var app = new Vue({
  el: '#app',
  data: {
    myUrl: '#',
    myFilename: ''
  },
  methods: {
    download: function() {
      const jsonData = encodeURIComponent('{"is_valid": true}')
      this.myUrl = `data:text/plain;charset=utf-8,${jsonData}`
      this.myFilename = 'example.json'
    }
  }
})
</script>

Generate file download from vue.js

1 Answers1