Я пишу кросс-платформенное мобильное приложение с помощью phonegap, и у меня есть вход для загрузки файлов для загрузки изображений одного изображения.
Проблема заключается в том, что большинство загружаемых изображений взяты с использованием мобильного телефона размером около 4 МБ.
Я хочу резко сжать эти изображения, так как я не нуждаюсь в них в высоком качестве вообще.
Кроме того, мне нужно, чтобы они были преобразованы в base64, а не в файл реального изображения. (Что у меня уже есть FileReader)
Любые идеи, как достичь этого? Может быть, использовать холст или что-то еще?
Update: вот что я до сих пор:
function shrink() {
var self = this;
var reader = new FileReader(); // init a file reader
var file = $('#file-input').prop('files')[0]; // get file from input
reader.onloadend = function() {
// shrink image
var image = document.createElement('img');
image.src = reader.result;
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
ctx.drawImage(image, 0, 0, 300, 300);
var shrinked = canvas.toDataURL('image/jpeg');
console.log(shrinked);
};
reader.readAsDataURL(file); // convert file to base64*/
}
но все, что я получаю, это черное изображение Благодаря