首頁(yè) 猿問(wèn) 請(qǐng)問(wèn)如何在JavaScript中將...

請(qǐng)問(wèn)如何在JavaScript中將文件轉(zhuǎn)換為base 64？

JavaScript

慕哥6287543 2019-10-20 12:08:17

如何在JavaScript中將文件轉(zhuǎn)換為base 64？現(xiàn)在，我將通過(guò)以下一行獲得File對(duì)象：file = document.querySelector('#files > input[type="file"]').files[0]我需要通過(guò)64基地的json發(fā)送這個(gè)文件。如何將其轉(zhuǎn)換為Base 64字符串？

查看完整描述

3 回答

揚(yáng)帆大魚

TA貢獻(xiàn)1799條經(jīng)驗(yàn) 獲得超9個(gè)贊

如果您正在尋找一種基于承諾的解決方案，這是@Dmitri的代碼，用于此：

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
  });}var file = document.querySelector('#files > input[type="file"]').files[0];getBase64(file).then(
  data => console.log(data));

反對(duì) 回復(fù) 2019-10-21

POPMUISE

TA貢獻(xiàn)1765條經(jīng)驗(yàn) 獲得超5個(gè)贊

在Dmitri Pavlutin和joShua.pling答案的基礎(chǔ)上，這里提供了一個(gè)擴(kuò)展版本，它提取base 64內(nèi)容(在開始時(shí)刪除元數(shù)據(jù))，并確保填充是正確的.

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => {
      let encoded = reader.result.replace(/^data:(.*;base64,)?/, '');
      if ((encoded.length % 4) > 0) {
        encoded += '='.repeat(4 - (encoded.length % 4));
      }
      resolve(encoded);
    };
    reader.onerror = error => reject(error);
  });}

反對(duì) 回復(fù) 2019-10-21