如何在 JavaScript 中將圖片轉換為 Base64 字串？

在JavaScript 中將影像轉換為Base64 字串

與遠端伺服器互動或在JavaScript 中處理影像資料時，將影像轉換為Base64 字串成為必要性。 Base64 字串表示文字格式的二進位數據，可以透過網路安全傳輸影像。

有多種技術可用於此轉換：

1. FileReader 方法：

此方法涉及使用XMLHttpRequest 將映像載入為blob，然後使用FileReader API 的readAsDataURL() 方法將其轉換為dataURL。 dataURL 由 header（表示資料格式）和 Base64 編碼的圖像資料組成。

function toDataURL(url, callback) {
  var xhr = new XMLHttpRequest();
  xhr.onload = function() {
    var reader = new FileReader();
    reader.onloadend = function() {
      callback(reader.result);
    }
    reader.readAsDataURL(xhr.response);
  };
  xhr.open('GET', url);
  xhr.responseType = 'blob';
  xhr.send();
}

toDataURL('https://www.gravatar.com/avatar/d50c83cc0c6523b4d3f6085295c953e0', function(dataUrl) {
  console.log('RESULT:', dataUrl)
})

透過將 dataURL 傳遞給回呼函數，您可以擷取 Base64 編碼的圖像字串。

以上是如何在 JavaScript 中將圖片轉換為 Base64 字串？的詳細內容。更多資訊請關注PHP中文網其他相關文章！