2015-02-03 13 views
1

Я вставив изображение в использовании этогоКак сжать и изменить размер изображения с Rich Text

var readFileIntoDataUrl = function (fileInfo) { 
    var loader = $.Deferred(), 
     fReader = new FileReader(); 
    fReader.onload = function (e) { 
     loader.resolve(e.target.result); 
    }; 
    fReader.onerror = loader.reject; 
    fReader.onprogress = loader.notify; 
    fReader.readAsDataURL(fileInfo); 
    return loader.promise(); 
}; 


$.when(readFileIntoDataUrl(fileInfo)).done(function (dataUrl) { 
     execCommand('insertimage', dataUrl); 
}).fail(function (e) { 
     options.fileUploadError("file-reader", e); 
}); 

Пусть говорят, что я добавил текст Hello World и добавил изображение. Теперь, когда я беру $("#editor").html() это показывает что-то вроде ниже

Вот источник образца изображения + текста

Hello World! 
img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/4QBoRXhpZgAATU0AKgAAAAgA 
BAEaAAUAAAABAAAAPgEbAAUAAAABAAAARgEoAAMAAAABAAIAAAExAAIAAAARAAAATgAAAAAAAABgAAAA 
AQAAAGAAAAABUGFpbnQuTkVUIHYzLjUuOAAA/9sAQwAHBQUGBQQHBgUGCAcHCAoRCwoJCQoVDxAMERgV 
[... more base64 data here....] 

Теперь здесь я быть_наст и text+image Так как на стороне сервера и на стороне клиента, я хочу, чтобы изменить размер & сжимать изображение

Так что никто не может вставить изображение> 5MP, а также сохранить форматированный текст с Копир.изобрами в моем дб

+0

Как это Здесь важна Java? (Я бы также предположил, что просто строка или две из данных base64 более чем достаточны, чтобы дать нам указание на то, что у вас есть ...) –

+0

На стороне сервера я получаю этот текст «text + image», так как Я занимаюсь сжатием изображений на стороне сервера с помощью java? – manish

+0

Ну, ваш вопрос спрашивает о том, как вы можете сделать это на стороне клиента * и * на стороне сервера ... мне очень непонятно, чего вы пытаетесь достичь. –

ответ

2

Это, как вы можете сделать это на стороне сервера (Java):

String imageData = "Hello World! img src=\"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAYABgAAD/4QBoR..."; 

    //Image data starting point 
    int startIndex = imageData.indexOf(";base64,") + ";base64,".length(); 

    //keep only the image data 
    imageData = imageData.substring(startIndex, imageData.length()); 

    //convert the image data String to a byte[] 
    byte[] dta = DatatypeConverter.parseBase64Binary(imageData); 
    try (InputStream in = new ByteArrayInputStream(dta);) { 
     BufferedImage fullSize = ImageIO.read(in); 

     // Create a new image half the size of the original image 
     BufferedImage resized = new BufferedImage(fullSize.getWidth()/2, fullSize.getHeight()/2, BufferedImage.TYPE_4BYTE_ABGR); 
     Graphics2D g2 = (Graphics2D) resized.getGraphics(); 
     g2.drawImage(fullSize, 0, 0, resized.getWidth(), resized.getHeight(), 0, 0, fullSize.getWidth(), fullSize.getHeight(), null); 
     g2.dispose(); 
    } catch (IOException e) { 
     e.printStackTrace(); 
    } 

Что касается части JavaScript вы можете использовать canvas, размер холста до размера, который вы хотите, нарисовать изображение на нем и использовать метод toDataURL для преобразования изображения в String