I'm using a jQuery plugin called wPaint to allow users to draw their own image. I send the resulting image as a string to the server as a string which begins with
data:image/png;base64,
I tried the two approaches below but with both the approaches i'm not able to store the image.
Approach 1
String imageData = parameterParser.getStringParameter("image", "");
byte[] imgByteArray = Base64.decodeBase64(imageData.getBytes());
FileOutputStream fileOutputStream = new FileOutputStream("/home/arvind/Desktop/test.png");
fileOutputStream.write(imgByteArray);
fileOutputStream.close();
In this case the file is written but doesn't show the image. However, when i remove the file extension i get the string that was sent to the server (i.e. whatever is in imageData).
Approach 2
String imageData = parameterParser.getStringParameter("image", "");
byte[] imgByteArray = Base64.decodeBase64(imageData.getBytes());
InputStream in = new ByteArrayInputStream(imgByteArray);
BufferedImage bImageFromConvert = ImageIO.read(in);
ImageIO.write(bImageFromConvert, "png", new File("/home/arvind/Desktop/test.png"));
The BufferedImage bImageFromConvert is null so I get an exception (IllegalArgumentException) when the file is created.
The Base64 class is from the apache commons codec library and is version 1.2.
Is there something I'm doing wrong?
Initially I had sent the data to the server using the following code.
$.ajax({
url : '/campaign/holiImageUpload.action',
type : 'POST',
data : "image=" + $("#wPaint2").wPaint("image")
success :function(data){
}
});
Now i'm sending the data to the server using the following code
var imgData = $("#wPaint2").wPaint("image");
$.ajax({
url : '/campaign/holiImageUpload.action',
type : 'POST',
data : {image : imgData},
success :function(data){
}
});
In the server side this is the final code :
String imageData = parameterParser.getStringParameter("image", "");
try {
imageData = imageData.substring(22);
byte[] imgByteArray = Base64.decodeBase64(imageData.getBytes());
InputStream in = new ByteArrayInputStream(imgByteArray);
BufferedImage bufferedImage = ImageIO.read(in);
ImageIO.write(bufferedImage, "png", new File("/home/arvind/Desktop/test.png"));
catch(Exception ex){
ex.printStrackTrace();
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With