javascript - websocket api - image encoding yields no image type on client side -

i have web socket server on tomcat 8 following binary use:

sess.getbasicremote().sendbinary(bf); 

where bf simple image bytes conversion follows:

bufferedimage img = imageio.read(...); bytearrayoutputstream baos = new bytearrayoutputstream(); imageio.write( img, "png", baos ); bytebuffer bf = bytebuffer.wrap(baos.tobytearray()); 

this code ends in the client side (javascript) blob , rendered image in browser , seems work fine. thing that's strange the image rendered typeless as:
data:;base64,ivborw0kggoaaaa......== without type (image/png).
if use online encoders same image get:
data:image/png;base64,ivborw0kggoaaaa......== (notice image/png type)

and question why that? image byte conversion wrong? said, image displayed fine missing type. note data send java websocket server not encoded base 64, on client side (via js's filereader.readasdataurl(blob) - common).

thanks lot , sorry long post

no, image byte array conversion not wrong. byte array conversion treats images binary stream, has nothing mediatype contained in it.

the type want see data uri media type. normal java code converting files byte array won't give data url scheme compliant url.

from rfc

data:[<mediatype>][;base64],

<mediatype> internet media type specification (with optional parameters.) appearance of ";base64" means data encoded base64. without ";base64", data (as sequence of octets) represented using ascii encoding octets inside range of safe url characters , using standard %xx hex encoding of urls octets outside range. if <mediatype> omitted, defaults text/plain;charset=us-ascii. shorthand, "text/plain" can omitted charset parameter supplied.

rfc source

when you're creating blob object in javascript have option pass mediatype when read using filereader.readasdataurl fills appropriate media type.

example below

var blob = new blob( [ arraybufferview ], { type: "image/jpeg" } ); 

source

you don't need bufferedimage in code, simple file read should suffice.

following equivalent of code apache fileutils.

bytebuffer bf = bytebuffer.wrap(fileutils.readfiletobytearray('test.jpg'));