[JS] 바이트코드(ByteCode) 첨부파일 다운로드 기능 구현 방법 정리!

이메일 첨부파일 다운로드 구현 중 해당 첨부파일을 api에서 내려줄 때, 바이트코드로 내려준다는 사실을 알게되었고,, 그럼 어떻게 다운로드 해야할까..? 하고 알아본 결과를 정리하려고 한다! 나중에 또 바이트코드 다운로드 기능 구현을 하게 될 경우 다시 찾아봐야지,,

개별 다운로드 함수

const downloadFile = (attachment: AttachmentInfo) => {
  var link = document.createElement('a');
  link.download = attachment.name;
  link.href = `data:${attachment.contentType};base64, ${attachment.contentBytes}`;
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
};

• 방법은 간단하다! 다운로드 버튼을 사용자가 눌렀을 경우 실행할 함수 하나만 생성해주면 된다!
• a 태그를 이용한 방법으로, api에서 내려주는 파일의 타입과 바이트코드 값을 이용해서 href 값을 넣어주고, 최종적으로 해당 태그를 클릭하는 함수를 실행함으로써 다운로드가 진행되도록 만드는 것이다.

전체 다운로드 함수

const downloadAllFile = () => {
  attachmentList.forEach((attachment) => {
    downloadFile(attachment);
  });
};

• 위 함수를 이용해서 전체 다운로드 기능도 간단하게 구현 가능하다.