2013-03-18 17 views
5

wPaintというjQueryプラグインを使用して、ユーザーが独自のイメージを描画できるようにしています。私は「のアプローチの両方が、以下を有する2つのアプローチを試みたBASE64、イメージを文字列としてPNGファイルに変換するには

、画像/ PNG:私は

データで始まる文字列としてサーバに文字列として得られる画像を送信します画像を保存できません。ファイルが書き込まれているが、画像は表示されません。この場合

アプローチ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(); 

。ただし、ファイル拡張子を削除すると、サーバーに送信された文字列(imageDataにあるもの)が取得されます。

アプローチ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")); 

たBufferedImage bImageFromConvertはnullであるので、ファイルが作成されたとき、私は例外(例外:IllegalArgumentException)を取得します。

Base64クラスは、Apacheコモンズコーデックライブラリのもので、バージョン1.2です。

私が間違っていることはありますか?

+0

画像は次のように変換する方法:

$.ajax({ url : '/campaign/holiImageUpload.action', type : 'POST', data : "image=" + $("#wPaint2").wPaint("image") success :function(data){ } }); 

は、今私は、これが最終的なコードで、サーバー側では、次のコード

var imgData = $("#wPaint2").wPaint("image"); $.ajax({ url : '/campaign/holiImageUpload.action', type : 'POST', data : {image : imgData}, success :function(data){ } }); 

を使用してサーバーにデータを送信しています文字列? –

+0

のプラグインwPaint(実際にはjQueryプラグインです)には、画像を文字列に変換する関数があります。クライアント側で同じ文字列のimg srcを割り当てると、文字列が正しく変換されます。画像が表示されます。 –

+1

それから同じプラグインでバイトに変換する必要があります。 –

答えて

5

最初に、次のコードを使用してサーバーにデータを送信しました。

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(); 
    } 
+0

それは私のためのトリック、ちょうど小さな修正:Base64.decodeBase64(imageData.getBytes())の代わりに、私はBase64を使用しました。getDecoder()。decode((imageData.getBytes())) – bks

0

data:image/png'base64をBase64でエンコードされたデータとともにデコードしようとしているようですか? Base64データをイメージバイトにデコードする前に、入力文字列からその文字列を削除する必要があります。

また、文字列を単に文字列としてバイトとしてデコードする必要はありません。

+0

いくつかのコードスニペットを共有できますか?私は、apisが文字列を入力として使用してイメージファイルを書き込むことを許してくれるかどうかはあまりよく分かりません。 –

+0

base64データは、バイトデータの文字列エンコーディングです。 base64でエンコードされた文字列をデコードすると、イメージのデータを含むバイト配列になります。私の答えに示唆されているように、コード化されていないデータを取り除くと、 – cjstehno

+0

既にそれを試したことがあります(つまり、imageData = imageData.substring(22)..そのトリックをしなかった) –

関連する問題