title: Is this proper way to download a file in Vue?
body: <p>I just want to ask, what is a good way to download file in Vue?</p>
  <p>Because when I do it like this, it is not working, files are empty, and there is a problem with content-disposable, I dont't know if I can be sure that format is correct:</p>
  <pre><code>api.downloadFile(fileId).then(response =&gt; {
      let blob = new Blob([response.data], { type: response.headers['content-type'] });
      let link = document.createElement('a');
      link.href = window.URL.createObjectURL(blob);
      link.download = &quot;nameofFile&quot; + '.pdf';
      link.click();
   }).catch(error=&gt;{
        console.log(error);
  })
  </code></pre>
  <p>When this solution below is working, and it works perfectly, it downloads good file, with good content, format (formats can be different, pdf, png, txt etc.) and with good name but I don't think it goes through axios interceptors, so I don't think it is secured etc. (maybe im wrong)</p>
  <pre><code>downloadFile(fileId) {
      console.log(fileId);
      let link = document.createElement('a');
      link.href = &quot;http://localhost:8081/download?fileId=&quot; + fileId;
      link.click();
  }
  </code></pre>
  <p>My axios method looks like this:</p>
  <pre><code>downloadFile:(fileId)=&gt;instance.get('/download?fileId=' + fileId).then(response=&gt;{
      return response;
  })
  </code></pre>
  <p>Can somebody tell me how to do it in a good way with blob, content-disposable and secure solution?</p>
  <p>My method on backend looks like this:</p>
  <pre><code>@GetMapping(value = &quot;/download&quot;)
      public ResponseEntity&lt;Resource&gt; download(@AuthenticationPrincipal User user,
                                               @RequestParam(&quot;fileId&quot;) String fileId) throws FileNotFoundException {
  
      Document file = storingService.loadFileByUsernameAndFileId(user.getUsername(), fileId);
      Resource resource = new ByteArrayResource(file.getBinary().getData());
  
      return ResponseEntity.ok()
                  .header(HttpHeaders.CONTENT_DISPOSITION, &quot;attachment; filename=\&quot;&quot; + file.getFileName() + &quot;\&quot;&quot;)
                  .header(HttpHeaders.CONTENT_TYPE, file.getContentType())
                  .body(resource);
      }
  </code></pre>
  <p>And response of this link: http://localhost:8081/download?fileId=xyz is:</p>
  <p><a href="https://i.stack.imgur.com/NLnEH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NLnEH.png" alt="enter image description here" /></a></p>