encoding problem when uploading binary files

365 views
Skip to first unread message

DAHHANE Walid

unread,
Sep 13, 2011, 3:35:42 PM9/13/11
to lib-gwt-file
hi ,

i want to upload the file draged from the desctop to a servlet, i did
it , but i have some encoding problems i guess !!!!

The file is uploaded succesfully ( for my case a png) but i can't read
it with the viewer, and if i compare the source file with the uploaded
one i see some caracters added like ‰ . i can' figure out the source
of the problem, and here is a snapshot of my source code.

thank you very much in advence.



@Override
public void onDrop(final DropEvent event) {
event.stopPropagation();
event.preventDefault();

final RequestBuilder rb = new
RequestBuilder(RequestBuilder.POST, "./servletUpload");

final String
type=event.getDataTransfer().getFiles().getItem(0).getType();
final String
name=event.getDataTransfer().getFiles().getItem(0).getName();

final FileReader fileReader=new FileReader();
LoadHandler handler=new LoadHandler() {

@Override
public void onLoad(LoadEvent evt) {

rb.setHeader("filename", name);
rb.setHeader("Content-Type", type
+";charset=ISO-8859-1");

try {

rb.sendRequest(fileReader.getResult(),
new RequestCallback() {

@Override
public void onError(Request arg0,
Throwable arg1) {
}

@Override
public void
onResponseReceived(Request arg0,
Response arg1) {
rb.setHeader("Content-Type",
type+";charset=ISO-8859-1");

} }
);
} catch (RequestException e1) {
// TODO Auto-generated catch block
e1.printStackTrace();
}

}
};;;

fileReader.readAsBinaryString(event.getDataTransfer().getFiles().getItem(0));

fileReader.addLoadHandler(handler);


}
});

Lukas Laag

unread,
Sep 13, 2011, 3:50:22 PM9/13/11
to lib-gw...@googlegroups.com

Hi Walid,

I have made a few tests with PNG files. The thing is actually feasible,
but the situation is not perfect.

As I was checking the spec to determine exactly what ReadAsBinaryString
is supposed to do and what a "binary string" exactly is, I discovered
that the W3C has updated the spec very recently (September 9th,
http://dev.w3.org/2006/webapi/FileAPI/#readAsBinaryString) and that
ReadAsBinaryString is already deprecated in favor of readAsArrayBuffer.
Of course they are perfectly entitled to do that as the spec is still a
draft and this is what drafts are made for.

Anyway, all browsers which implement the file API are still on the old
spec, so as of today, you are still supposed to use ReadAsBinaryString.
It turns out that a binary string is "a string, in which every byte is
represented by an integer in the range [0..255]". So there is no way you
can send that as iso8859-1, which is for latin text.

I think the safe way to manipulate it to convert it to base64 before
sending it. This way you will bypass all the encoding problems as base64
can be transmitted easily whatever the charset (utf-8, ascii, iso8859...)

To convert the image, add this function to your class:
private static native String base64encode(String str) /*-{
return $wnd.btoa(str);
}-*/;
Then you can call it like this:
String result64 = base64encode(reader.getResult());

Of course you will have to decode it from base64 on the server (how you
do that depends of course of the kind of server you are uploading to)...
and the content length of the uploaded file will be 4/3 larger as if you
were doing it in binary form directly.

I have updated the lib-gwt-file-test example in the SVN trunk to take
PNG into account (it still does not do any uploading but it displays the
dragged image correctly after having converted them as a base64 data url
in png, proving that ReadAsBinaryString + base64encode is a sound approach)

http://code.google.com/p/lib-gwt-file/source/list

Regards

Lukas

DAHHANE Walid

unread,
Sep 13, 2011, 4:58:23 PM9/13/11
to lib-gwt-file
thanks a lot for the reply,it's exactly what i needed. its work now.


for whos interested of the Java server side code; here is what i did
to get it work;


public void doPost(HttpServletRequest request, HttpServletResponse
response)
throws ServletException, IOException {

File f = new File(request.getHeader("filename"));

Base64InputStream decodingStream = new
Base64InputStream(request.getInputStream());

Writer w = new BufferedWriter(new OutputStreamWriter(new
FileOutputStream(f),Charset.forName("ISO-8859-1")));

int c;
while((c=decodingStream.read())!=-1){
w.write(c);
}
w.flush();
w.close();
decodingStream.close();
> that the W3C has updated the spec very recently (September 9th,http://dev.w3.org/2006/webapi/FileAPI/#readAsBinaryString) and that
Reply all
Reply to author
Forward
0 new messages