[javascript] 바이너리 데이터를 다운로드하는 방법

이번에는 JavaScript를 사용하여 웹 애플리케이션에서 바이너리 데이터를 다운로드하는 방법에 대해 알아보겠습니다.

Blob와 URL.createObjectURL을 활용하기

가장 간단한 방법은 Blob 객체와 URL.createObjectURL 메서드를 사용하여 바이너리 데이터를 다운로드하는 것입니다. 아래는 간단한 예제 코드입니다.

function downloadBinaryData(data, fileName, mimeType) {
  const blob = new Blob([data], { type: mimeType });
  const url = URL.createObjectURL(blob);

  const a = document.createElement('a');
  a.href = url;
  a.download = fileName;
  a.click();

  URL.revokeObjectURL(url);
}

위의 코드에서 downloadBinaryData 함수는 바이너리 데이터, 파일 이름 및 MIME 유형을 매개변수로 받아와서 브라우저에서 다운로드할 수 있는 링크를 생성합니다. 이 함수를 호출하면 해당 바이너리 데이터가 다운로드됩니다.

XMLHttpRequest를 활용하기

또 다른 방법은 XMLHttpRequest를 사용하여 서버에서 바이너리 데이터를 가져와서 다운로드하는 것입니다. 아래는 이러한 방법의 예제 코드입니다.

function downloadBinaryDataFromServer(url, fileName) {
  const xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.responseType = 'blob';

  xhr.onload = function() {
    const blob = xhr.response;
    const url = URL.createObjectURL(blob);

    const a = document.createElement('a');
    a.href = url;
    a.download = fileName;
    a.click();

    URL.revokeObjectURL(url);
  };

  xhr.send();
}

위의 코드에서 downloadBinaryDataFromServer 함수는 서버에서 바이너리 데이터를 가져와서 다운로드하는 기능을 합니다. 함수를 호출할 때 서버의 URL과 파일 이름을 전달하면 해당 바이너리 데이터가 다운로드됩니다.

이제 위의 두 가지 방법을 사용하여 JavaScript를 통해 바이너리 데이터를 다운로드할 수 있는 방법에 대해 알아보았습니다. 원하는 방법을 선택하여 웹 애플리케이션에서 바이너리 데이터를 안전하게 처리하세요.

더 많은 정보가 필요하시면 MDN web docs를 참고하세요.

간단히 정리하면, JavaScript를 사용하여 바이너리 데이터를 다운로드하는 방법에 대해 알아보았습니다. BlobURL.createObjectURL을 활용하거나 XMLHttpRequest를 사용하는 방법을 살펴보았습니다.