Bagaimana untuk Menukar Blob kepada String Base64 dalam JavaScript?

Tukar Blob kepada Base64 Menggunakan FileReader

Dalam JavaScript, anda mungkin menghadapi situasi di mana anda perlu menukar objek Blob, yang biasanya mewakili imej atau fail, kepada rentetan Base64. Penukaran ini diperlukan apabila anda perlu menyimpan atau menghantar data binari dalam format teks, seperti menghantarnya melalui HTTP atau menyimpannya dalam pangkalan data.

Coretan kod yang anda berikan, menggunakan Blob dan API FileReader , bertujuan untuk melaksanakan penukaran ini. Walau bagaimanapun, anda menyebut isu di mana pembolehubah sumber mengembalikan null.

Menggunakan FileReader untuk Blob ke Base64

Penyelesaian kepada isu ini ialah mengubah suai kod untuk menggunakan FileReader dengan betul. Berikut ialah kod yang dikemas kini:

var reader = new FileReader();
reader.readAsDataURL(blob); 
reader.onloadend = function() {
  var base64data = reader.result;                
  console.log(base64data);
}

Dalam kod ini, kaedah readAsDataURL() digunakan untuk mengekod data Blob sebagai rentetan Base64. Pengendali acara onloadend kemudiannya digunakan untuk mendapatkan semula data yang dikodkan base64 daripada sifat reader.result.

Kaedah Lebih Mudah dengan jQuery

Sebagai alternatif, anda boleh mempertimbangkan untuk menggunakan jQuery untuk pelaksanaan yang lebih ringkas:

$.ajax({
  url: "upload.php", // URL to submit the form
  type: "POST",
  data: {
    image: blob
  },
  beforeSend: function(xhr) {
    // Encode the blob as a base64 string
    var reader = new FileReader();
    reader.readAsDataURL(blob);
    reader.onloadend = function() {
      // Append the encoded data to the form data
      var data = reader.result;
      xhr.setRequestHeader("Image-Data", data);
    }
  }
});

Perhatikan bahawa kaedah jQuery Ajax akan mengendalikan penghantaran yang dikodkan Rentetan Base64 bersama-sama dengan data borang, menjadikannya pendekatan yang lebih mudah.

Mengalih keluar Pengisytiharan Data-URL

Adalah penting untuk ambil perhatian bahawa hasil Blob akan termasuk pengisytiharan Data-URL sebelum Data berkod Base64. Untuk mendapatkan semula rentetan yang dikodkan Base64 sahaja, anda boleh menggunakan kod berikut:

var base64String = base64data.substring(base64data.indexOf(',') + 1);

Atas ialah kandungan terperinci Bagaimana untuk Menukar Blob kepada String Base64 dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!