home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

วิธีแปลงรูปภาพเป็น Base64 String ด้วย JavaScript

ใช้ FileReader API** ร่วมกับ XMLHttpRequest เพื่อดึงรูปภาพและแปลงเป็น Data URL (base64)

ตัวอย่าง

<!DOCTYPE html>
<html>
  <body>
    <script>
      function toDataURL(url, callback) {
        var httpRequest = new XMLHttpRequest();
        httpRequest.onload = function() {
          var fileReader = new FileReader();
          fileReader.onloadend = function() {
            callback(fileReader.result);
          }
          fileReader.readAsDataURL(httpRequest.response);
        };
        httpRequest.open('GET', url);
        httpRequest.responseType = 'blob';
        httpRequest.send();
      }
      toDataURL('https://www.tutorialspoint.com/videotutorials/images/tutor_connect_home.jpg', function(dataUrl) {
        document.write('Result in string:', dataUrl)
      })
    </script>
  </body>
</html>