hình ảnh mã hóa/giải mã với hình ảnh ngắt base64

Question

Tôi đang cố mã hóa và giải mã hình ảnh. Tôi đang sử dụng phương thức readAsDataURL của FileReader để chuyển đổi hình ảnh thành base64. Sau đó, để chuyển đổi lại, tôi đã thử sử dụng readAsBinaryString() và atob() mà không có may mắn. Có cách nào khác để duy trì hình ảnh mà không cần mã hóa base64 không?

readAsBinaryString()

Starts reading the contents of the specified Blob, which may be a File. When the read operation is finished, the readyState will become DONE, and the onloadend callback, if any, will be called. At that time, the result attribute contains the raw binary data from the file.

Bất kỳ ý tưởng nào tôi đang làm sai ở đây?

Mẫu Mã http://jsfiddle.net/qL86Z/3/

$("#base64Button").on("click", function() { 
    var file = $("#base64File")[0].files[0] 
    var reader = new FileReader(); 

    // callback for readAsDataURL 
    reader.onload = function (encodedFile) { 
     console.log("reader.onload"); 
     var base64Image = encodedFile.srcElement.result.split("data:image/jpeg;base64,")[1]; 
     var blob = new Blob([base64Image],{type:"image/jpeg"}); 
     var reader2 = new FileReader(); 

     // callback for readAsBinaryString 
     reader2.onloadend = function(decoded) { 
      console.log("reader2.onloadend"); 
      console.log(decoded); // this should contain binary format of the image 

      // console.log(URL.createObjectURL(decoded.binary)); // Doesn't work 
     }; 
     reader2.readAsBinaryString(blob); 

     // console.log(URL.createObjectURL(atob(base64Image))); // Doesn't work 

    }; 
    reader.readAsDataURL(file); 
    console.log(URL.createObjectURL(file)); // Works 
}); 

Cảm ơn!

Answer 1

Sau một số nghiên cứu khác, tôi tìm thấy câu trả lời từ here Về cơ bản, tôi cần bọc mã nhị phân thô trong bộ lọc mảng và chuyển đổi ký tự nhị phân thành Unicode.

Đây là mã đó đã mất tích,

var binaryImg = atob(base64Image); 
    var length = binaryImg.length; 
    var ab = new ArrayBuffer(length); 
    var ua = new Uint8Array(ab); 
    for (var i = 0; i < length; i++) { 
     ua[i] = binaryImg.charCodeAt(i); 
    } 

Mẫu mã đầy đủ là here

Answer 2

URL.createObjectURL mong đợi một Blob (có thể là File) làm đối số của nó. Không phải là một chuỗi. Đó là lý do tại sao URL.createObjectURL(file) hoạt động.

Thay vào đó, bạn đang tạo một FileReaderreader mà đọc file như một url dữ liệu, sau đó bạn sử dụng url dữ liệu để tạo Blob khác (với những nội dung tương tự). Và sau đó bạn thậm chí tạo một reader2 để nhận được một chuỗi nhị phân từ chỉ được xây dựng blob. Tuy nhiên, không phải phần chuỗi url base64Image (ngay cả khi btoa - được mã hóa thành chuỗi lớn hơn) hoặc chuỗi decoded.binary là các đối số vaild thành URL.createObjectURL!