아약스 응답에서 PDF 파일 다운로드

Question

브라우저에서 아약스 응답에서받은 PDF 파일을 다운로드하려고합니다. 크롬에서

var req = new XMLHttpRequest(); 
    req.open("POST", "/servicepath/Method?ids=" + ids, true); 
    req.responseType = "blob"; 
    req.onreadystatechange = function() { 
     if (req.readyState === 4 && req.status === 200) { 
      var blob = req.response; 
      var link = document.createElement('a'); 
      link.href = window.URL.createObjectURL(blob); 
      link.download = "PdfName-" + new Date().getTime() + ".pdf"; 
      link.click(); 
     } 
    }; 
    req.send(); 

불행하게도이 단지 작품을하지만 파이어 폭스 + IE : 나는 Download pdf file using jquery ajax에서 영감을

는

클릭/다운로드 이벤트 같은 시뮬레이션합니다. 마지막 두 브라우저에서 실행하려고하면 아무 일도 일어나지 않습니다.

스크립트와 마크 업은 CMS의 상속으로 인해 iframe 내부에 배치되지만 영향이 있는지 확실하지 않습니다.

모든 최신 브라우저에서이를 최적화하는 방법에 대한 아이디어가 있으십니까? 나는 또한 사파리의 버전을 얻으려고 노력했다

var req = new XMLHttpRequest(); 
req.open("POST", "/servicepath/Method?ids=" + ids, true); 
req.responseType = "blob"; 
req.onreadystatechange = function() { 
    if (req.readyState === 4 && req.status === 200) { 
     var filename = "PdfName-" + new Date().getTime() + ".pdf"; 
     if (typeof window.chrome !== 'undefined') { 
      // Chrome version 
      var link = document.createElement('a'); 
      link.href = window.URL.createObjectURL(req.response); 
      link.download = "PdfName-" + new Date().getTime() + ".pdf"; 
      link.click(); 
     } else if (typeof window.navigator.msSaveBlob !== 'undefined') { 
      // IE version 
      var blob = new Blob([req.response], { type: 'application/pdf' }); 
      window.navigator.msSaveBlob(blob, filename); 
     } else { 
      // Firefox version 
      var file = new File([req.response], filename, { type: 'application/force-download' }); 
      window.open(URL.createObjectURL(file)); 
     } 
    } 
}; 
req.send(); 

하지만 잘 작동하지 않았다 :

Answer 1

모든 최신 브라우저에서 최적화하는 방법에 대한 아이디어가 있으십니까?

예, IE11, Firefox 47 및 Chrome 52를 사용하여 Windows 10에서 테스트 한 솔루션을 제공 할 수 있습니다. 현재 Microsoft Edge 용으로 아무 것도 없습니다.

처음에는 IE 나 다른 두 브라우저에 있는지 구별해야합니다. 이는 IE11에서 당신은 사용할 수 있습니다

window.navigator.msSaveBlob(req.response, "PdfName-" + new Date().getTime() + ".pdf"); 

코드가 크롬에서 작동 다른 두 브라우저의

하지만 파이어 폭스에 문서 본문에 요소를 추가하지 않았기 때문에.

그래서 수정 된 코드는 다음과 같습니다

var req = new XMLHttpRequest(); 
req.open("POST", "/servicepath/Method?ids=" + ids, true); 
req.responseType = "blob"; 
req.onreadystatechange = function() { 
    if (req.readyState === 4 && req.status === 200) { 

    // test for IE 

    if (typeof window.navigator.msSaveBlob === 'function') { 
     window.navigator.msSaveBlob(req.response, "PdfName-" + new Date().getTime() + ".pdf"); 
    } else { 
     var blob = req.response; 
     var link = document.createElement('a'); 
     link.href = window.URL.createObjectURL(blob); 
     link.download = "PdfName-" + new Date().getTime() + ".pdf"; 

     // append the link to the document body 

     document.body.appendChild(link); 

     link.click(); 
    } 
    } 
}; 
req.send(); 

Answer 2

이 버전은 모든 최신 브라우저에서 작동합니다. 조사를 계속하고 그에 대한 해결책을 제시하려고합니다.