[Nuxtjs&Vuejs]AWS S3 업로드한 파일 브라우저에서 다운로드 버튼으로 다운로드 하는 기능 만들기

요규사항

사용자가 s3에 업로드한 파일을 브라우저 상에서 버튼을 클릭해서 다운로드

Vue 컴포넌트 파일 구현 코드

html

<template>
  <a ref="save" class="save-button" download="">저장</a>
  <span class="dot">·</span>
  <a ref="save" class="save-button" :href="feedback.attachment[0]" download="">
  다른 이름으로 저장
  </a>
</template>

script

export default ({
  // ...
  async mounted() {
    await fetch(this.feedback.attachment, { method: 'GET' })
      .then(res => {
        return res.blob();
      })
      .then(blob => {
        const url = window.URL.createObjectURL(blob);
        this.$refs.save.href = url;
      });
  },
})