[Vuejs]-Downloaded PDF file is broken

by

0👍

I found an example of the code that may work for you.

It doesn’t include the base64 translation I mentioned in the comments, but it may not be necessary and will save you some work on the backend. I’ve found that I’ve had some issues when I tried without it, but I can’t recall what that was about.

showFile(blob){
  // It is necessary to create a new blob object with mime-type explicitly set
  // otherwise only Chrome works like it should
  var newBlob = new Blob([blob], {type: "application/pdf"})

  // IE doesn't allow using a blob object directly as link href
  // instead it is necessary to use msSaveOrOpenBlob
  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(newBlob);
    return;
  } 

  // For other browsers: 
  // Create a link pointing to the ObjectURL containing the blob.
  const data = window.URL.createObjectURL(newBlob);
  var link = document.createElement('a');
  link.href = data;
  link.download="file.pdf";
  link.click();
  setTimeout(function(){
    // For Firefox it is necessary to delay revoking the ObjectURL
    window.URL.revokeObjectURL(data);
  , 100}
}

fetch([url to fetch], {[options setting custom http-headers]})
  .then(r => r.blob())
  .then(showFile)

source: https://blog.jayway.com/2017/07/13/open-pdf-downloaded-api-javascript/

Leave a comment