JavaScript에서 Blob을 Base64 문자열로 변환하는 방법은 무엇입니까?

FileReader를 사용하여 Blob을 Base64로 변환

JavaScript에서는 일반적으로 이미지나 파일을 나타내는 Blob 객체를 변환해야 하는 상황이 발생할 수 있습니다. Base64 문자열로. 이 변환은 바이너리 데이터를 HTTP를 통해 보내거나 데이터베이스에 저장하는 등 텍스트 형식으로 저장하거나 전송해야 할 때 필요합니다.

Blob 및 FileReader API를 사용하여 제공한 코드 조각 , 이 변환을 수행하는 것을 목표로 합니다. 그러나 소스 변수가 null을 반환하는 문제를 언급하셨습니다.

Blob용 FileReader를 Base64로 사용

이 문제에 대한 해결책은 FileReader를 올바르게 사용하도록 코드를 수정하는 것입니다. 업데이트된 코드는 다음과 같습니다.

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

이 코드에서는 readAsDataURL() 메서드를 사용하여 Blob 데이터를 Base64 문자열로 인코딩합니다. 그런 다음 onloadend 이벤트 핸들러를 사용하여 reader.result 속성에서 base64로 인코딩된 데이터를 검색합니다.

jQuery를 사용하는 더 쉬운 방법

또는 더 간결한 구현을 위해 jQuery를 사용하는 것을 고려할 수 있습니다.

$.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);
    }
  }
});

jQuery Ajax 메소드는 양식과 함께 인코딩된 Base64 문자열 전송을 처리합니다.

Data-URL 선언 제거

Blob의 결과에는 Base64로 인코딩된 데이터 앞에 Data-URL 선언이 포함된다는 점에 유의하는 것이 중요합니다. Base64로 인코딩된 문자열만 검색하려면 다음 코드를 사용할 수 있습니다.

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

위 내용은 JavaScript에서 Blob을 Base64 문자열로 변환하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!