Размер изображения увеличивается в формате base64 - PullRequest
Новая
       11

Размер изображения увеличивается в формате base64

0 голосов
/ 17 октября 2019

У меня есть простой входной файл, который принимает только изображения. Я хочу показать сообщение об успешной загрузке любых изображений размером менее 2 МБ. Но когда я выбираю изображение и проверяю элемент, изображение конвертируется в формат base64, а размер строки base64 превышает (соотношение 4/3) фактический размер изображения.

Мой вопрос
1. Как сохранить размер таким же, как фактическое изображение.?
2. Есть ли другой способ исправить это.

Мой код: 

<input type="file" onchange="uploadImage(event)" />

jQuery 

function uploadImage(event){
var fileReader = new FileReader();

if (fileReader && fileList && fileList.length) {
            $scope.fileSize = fileList[0].size;
            fileReader.readAsDataURL(fileList[0]);

            var ext = fileList1.value.match(/\.([^\.]+)$/)[1].toLowerCase();
            switch (ext) {
                case 'jpg':
                case 'bmp':
                case 'png':
                case 'tif':
                case 'jpeg':
                    $scope.hasInvalidFiles = false;
                    fileReader.onload = function (event) {

                        var imageData = event.target.result;
                        console.log(imageData);
                    }

                    if (fileList[0].size < 2000) {
                             console.log("success");
                    }
                    else {
                        console.log("Failure");
                    }
                    break;
                default:
                   console.log("Invalid");
            }
        }

}

1 Ответ

0 голосов
/ 17 октября 2019 

function uploadImage(event) {
  var file = event.target.files[0]
  var fileReader = new FileReader();
  fileReader.readAsDataURL(file);
  fileReader.onload = function(e) {
    console.log(e.target.result)
    var imgBase = e.target.result;
    if (imgBase.split(',')[0].indexOf('base64') >= 0) {
      var result = imgBase.split(',')[1]; // This is the actual size.
    }
  }
  if (file.size < 2 * 1024 * 1024) {
    alert("Success");
  } else {
    alert("Failure");
  }
}
<input type="file" accept="image/png, image/jpeg" onchange="uploadImage(event)" />

Если вы хотите принимать только изображения. Вы можете использовать атрибут accpet. Кроме того, единицей значения размера в объекте File является байт, а не килобайт.

...