>  기사  >  웹 프론트엔드  >  브라우저 전반에 걸쳐 JavaScript의 바이너리 웹 서비스 응답에서 PDF를 생성하는 방법은 무엇입니까?

브라우저 전반에 걸쳐 JavaScript의 바이너리 웹 서비스 응답에서 PDF를 생성하는 방법은 무엇입니까?

Barbara Streisand
Barbara Streisand원래의
2024-10-26 21:33:29436검색

How to Generate a PDF from a Binary Web-Service Response in JavaScript Across Browsers?

JavaScript의 바이너리 웹 서비스 응답에서 PDF 작성

배경:

이 질문 Ajax 요청을 통해 검색된 바이너리 문자열에서 PDF 파일을 생성하는 문제를 해결합니다. 제공된 바이너리 스트림은 PDF 헤더와 콘텐츠로 구성됩니다. data-uri 방법은 일부 브라우저에서는 작동하지만 Internet Explorer 9 및 Firefox에서는 작동하지 않습니다.

문제:

문제는 크로스 브라우저를 찾는 데 있습니다. 웹 서비스 구현을 편집하지 않고도 바이너리 응답에서 PDF 파일을 만들 수 있는 솔루션입니다.

해결책:

이 문제를 해결하려면 다음 접근 방식을 따르세요. 제안:

Blob 및 다운로드 속성 활용:

XMLHttpRequest 개체의 responseType을 "blob"로 설정하면 응답이 Blob 개체로 수신됩니다. 이 Blob은 PDF 파일을 나타냅니다. 그런 다음 createObjectURL 메서드를 사용하여 사용자가 PDF를 다운로드할 수 있도록 다운로드 링크를 생성할 수 있습니다.

이 솔루션을 시연하기 위해 다음 코드 조각을 사용할 수 있습니다.

<code class="javascript">var request = new XMLHttpRequest();
request.open("GET", "/path/to/pdf", true); 
request.responseType = "blob";
request.onload = function (e) {
    if (this.status === 200) {
        // `blob` response
        console.log(this.response);
        // create `objectURL` of `this.response` : `.pdf` as `Blob`
        var file = window.URL.createObjectURL(this.response);
        var a = document.createElement("a");
        a.href = file;
        a.download = this.response.name || "detailPDF";
        document.body.appendChild(a);
        a.click();
        // remove `a` following `Save As` dialog, 
        // `window` regains `focus`
        window.onfocus = function () {                     
          document.body.removeChild(a)
        }
    };
};
request.send();</code>

이점:

이 방법은 다음과 같은 장점을 제공합니다.

  • IE9, Firefox, Opera, Chrome 및 Safari를 포함한 모든 주요 브라우저와의 호환성
  • 일부 브라우저에서 발생하는 data-uri 접근 방식의 결함 방지
  • 사용자가 PDF 파일을 편리하게 다운로드할 수 있음

위 내용은 브라우저 전반에 걸쳐 JavaScript의 바이너리 웹 서비스 응답에서 PDF를 생성하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.