여러 파일을 base64 문자열로 변환하는 방법?

여러 파일을 base64 문자열로 변환하는 방법?

나는 이런 구성요소를 가지고 있다.

<input type="file" multiple @change="toBase64Handler($event)">

<script>
 data() {
  return {
     files: [],
   }
 },
 methods: {
  tobase64Handler(event) {
   // the code
  }
 }
</script>

그리고 선택한 모든 파일을 base64 문자열로 변환하고 싶다.

files: [
  {
   selectedFile: 'ajsdgfauywdljasvdajsgvdasdo1u2ydfouayvsdlj2vo8ayasd...'
  },
  {
   selectedFile: 'askdhgoiydvywdljasvdajsgvdasdo1u2ydfoakjgsfdjagswsd...'
  },
  {
   selectedFile: '12edashjvlsljasvdajsgvdasdo1u2ydfouayvsdlj2vo8ayfsd...'
  },
]

어떻게 하면 그것을 이룰 수 있을까?

파일이 도우미 메서드를 호출하더라도 반복할 수 있음toBase64, 모두 푸시Promises배열로 이동하여 모두 해결:

  toBase64(file) {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = () => resolve(reader.result);
      reader.onerror = error => reject(error);
    });
  };

  async tobase64Handler(files) {
    const filePathsPromises = [];
    files.forEach(file => {
      filePathsPromises.push(this.toBase64(file));
    });
    const filePaths = await Promise.all(filePathsPromises);
    const mappedFiles = filePaths.map((base64File) => ({ selectedFile: base64File }));
    return mappedFiles;
  }

이 방법이 효과가 있을 것이다:JSON.stringify(files)여기서 그것에 대해 더 많이 읽을 수 있다.나중에 원래 어레이, 개체 또는 값으로 되돌리려면JSON.parse(files)여기서 그것에 대해 더 많이 읽을 수 있다.

UPDATE: 알고 보니 내가 틀렸고 JSON.stringify/parse가 파일과 함께 작동하지 않는다(@patrick evans 정보 고마워).더 나은 것 같은 이 답을 찾았다(@ahmedhamdy by @) hamdy

참조URL: https://stackoverflow.com/questions/58957130/how-to-turn-multiple-files-into-base64-string