how do I encode image as string

[Darcy Kahle]

I am trying to pass an image that I am manipulating in a java applet to
a javascript fuction, to be used there as either the source for an img
tag, or to save and/or print. Another possibility is to pass the image
up to a php script for further processing on the server. I know that
you can use ImageIO to save the image to a ByteArrayOutputStream, and
then use the stream's toString to get a string, but passing that string
to javascript truncates the image after the first 4 characters, due to a
null character (hex 0). I have been able to encode the string to
base64, but I do not know if anything more is needed to be done for the
javascript function to use it as an image.

I know that you can embed images in HTML by storing a special string
representation of the image in a javascript variable, but I do not know
what this format is. If I knew this format, I could encode the image in
Java, and then pass this string on. Any one know anything that could
help me?

Darcy Kahle

 

[Kevin McMurtrie]

I am trying to pass an image that I am manipulating in a java applet to
a javascript fuction, to be used there as either the source for an img
tag, or to save and/or print. Another possibility is to pass the image
up to a php script for further processing on the server. I know that
you can use ImageIO to save the image to a ByteArrayOutputStream, and
then use the stream's toString to get a string, but passing that string
to javascript truncates the image after the first 4 characters, due to a
null character (hex 0). I have been able to encode the string to
base64, but I do not know if anything more is needed to be done for the
javascript function to use it as an image.

I know that you can embed images in HTML by storing a special string
representation of the image in a javascript variable, but I do not know
what this format is. If I knew this format, I could encode the image in
Java, and then pass this string on. Any one know anything that could
help me?

Darcy Kahle

May an applet listen to a non-privileged port on 127.0.0.1? It doesn't
seem like a security risk but I don't know if it's allowed. If it is,
you could serve the image directly to the browser.

 

[christopher]

One of us is missing the point. Why don't you put your applet on the
page where the image is, and open another window if you need dialog,
controls, whatever?

 

[tzvika.barenholz]

A useful, if ugly, way is to actually store the bytes of the image in
your class

static final byte[] pic = {45,34,-120 ....}

and then initialize and ImageIcon with the bytes.

 

[Tor Iver Wilhelmsen]

static final byte[] pic = {45,34,-120 ....}

and then initialize and ImageIcon with the bytes.

Not that unlike C/C++, that code does NOT store the array in the
class, but instead generates code equivalent to

pic[0] = 45;
pic[1] = 34;
....
etc.

Reading from a resource/file is ALWAYS better than hardcoding large
arrays that way.

 

[Darcy Kahle]

A useful, if ugly, way is to actually store the bytes of the image in
your class

static final byte[] pic = {45,34,-120 ....}

and then initialize and ImageIcon with the bytes.

This is along the lines that I thought would be necessary. That is,
send the bytes of the image from the java applet to the web page, but
somehow encoded in a string, which would ultimately be placed in the src
attribute of the img tag. I just don't know the proper format of this
string, and I realize that I cannot simply pass the image object back,
as there is no javascript equivalent. I never thought of setting up a
port listener on the loopback interface, and request the image that way.
I will look into this possibility.

 

[Darcy Kahle]

May an applet listen to a non-privileged port on 127.0.0.1? It doesn't
seem like a security risk but I don't know if it's allowed. If it is,
you could serve the image directly to the browser.

Thanks for this idea, but it appears that the security policy allows
applets to only open a port on the server that the applet was downloaded
from. Since applets are rarely downloaded fron the localhost, the only
purpose of setting up an applet as a simple http server would be to
respond to requests from an app running on the server.

But ... during my research on this, I had a brainstorm, and I would like
to hear some ideas about it's feasability. Is it possible to write a
public java function that responds with the response that an http server
would normally generate when an image is requested, and use that
function as the src attribute of a IMG tag?

To clarify my goal, here, I am trying to work around the restrictions
for printing from a java applet. My idea is that if the applet can
generate an image, it can be displayed in an IMG tag, and the resulting
page can then be printed from the browser. All this should not touch
any system resources from java. My other use, for pre-processing an
image prior to uploading it to the server, can be resolved by having the
applet post the processed image directly to the server's upload url.

 

[Brian Munroe]

I know that you can embed images in HTML by storing a special string
representation of the image in a javascript variable, but I do not know
what this format is. If I knew this format, I could encode the image in
Java, and then pass this string on. Any one know anything that could

help me?

I think you are looking for the XBM image format. As far as I can
tell, this is the only format you can serialize into javascript like
you are trying to do.

(about 1/2 down the page, Creating graphics on-the-fly with JavaScript)
http://www.javaworld.com/javaworld/jw-08-1996/jw-08-javascript_p.html

-- brian

 

[Chris Uppal]

I know that you can embed images in HTML by storing a special string
representation of the image in a javascript variable, but I do not know
what this format is. If I knew this format, I could encode the image in
Java, and then pass this string on. Any one know anything that could
help me?

It's /remotely/ possible that you are thinking of the 'data' URL scheme, as
defined in RFC2397.

E.g. (taken from that RFC)

<IMG
SRC="data:image/gif;base64,R0lGODdhMAAwAPAAAAAAAP///ywAAAAAMAAw
AAAC8IyPqcvt3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvONmOZtfzgFz
ByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUqrXF5Y5lKh/DeuNcP5yLWGsEbtLiOSp
a/TPg7JpJHxyendzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZXZeYGejmJl
ZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4OK05M0vDk0Q4XUtwvKOzrcd3iq9uis
F81M1OIcR7lEewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5VWzXyym7PH
hhx4dbgYKAAA7"
ALT="Larry">

-- chris

 

[Darcy Kahle]

Darcy Kahle wrote:




It's /remotely/ possible that you are thinking of the 'data' URL scheme, as
defined in RFC2397.

E.g. (taken from that RFC)

<IMG
SRC="data:image/gif;base64,R0lGODdhMAAwAPAAAAAAAP///ywAAAAAMAAw
AAAC8IyPqcvt3wCcDkiLc7C0qwyGHhSWpjQu5yqmCYsapyuvUUlvONmOZtfzgFz
ByTB10QgxOR0TqBQejhRNzOfkVJ+5YiUqrXF5Y5lKh/DeuNcP5yLWGsEbtLiOSp
a/TPg7JpJHxyendzWTBfX0cxOnKPjgBzi4diinWGdkF8kjdfnycQZXZeYGejmJl
ZeGl9i2icVqaNVailT6F5iJ90m6mvuTS4OK05M0vDk0Q4XUtwvKOzrcd3iq9uis
F81M1OIcR7lEewwcLp7tuNNkM3uNna3F2JQFo97Vriy/Xl4/f1cf5VWzXyym7PH
hhx4dbgYKAAA7"
ALT="Larry">

-- chris

Thanks. That is precisely what I was thinking of. I saw examples of
this elsewhere, but I did not see any pattern, and I was unable to
locate the RFC for it. I thought that base64 encoding played a part,
and I knew that I had to specify that somehow, but I did not know how
that worked. I will try implementing that, and let all know how it
works out.

 

[Darcy Kahle]

Thanks. That is precisely what I was thinking of. I saw examples of
this elsewhere, but I did not see any pattern, and I was unable to
locate the RFC for it. I thought that base64 encoding played a part,
and I knew that I had to specify that somehow, but I did not know how
that worked. I will try implementing that, and let all know how it
works out.

OOPS - Although this seems like what I was after, and it may yet still
be, It looks like Internet Explorer is behind the times in that it does
not support the data url scheme. (Note to MS: Wake up and support more
of these RFCs). I tried a test with the expample given under IE and
Mozilla. IE was a write-off. Mozilla displayed the image if the tag
looked like the example above. When I tried to store the source data in
a javascript variable, and reference it, ala "javascript:timg", the
image was not displayed. I did this to test whether the string could be
passed from a java or javascript function. It looks like I would have
to use a javascript to set the src attribute to the string, and try to
reload the image that way.

I did find a javascript example that when provided an array of bytes, it
encodes it into a string for use in the HTML. I am in the middle of
testing that as well, but I have to modify it to use a Vector of Byte
objects, since passing arrays of anything from Java to Javascript has
never worked for me. (The javascript function failed on the byte array
when it did not find the length attribute of the array).

On another note, it would be so much simpler if I could simply call a
public function of the applet, and pass into it the graphics context of
the print job, initiated in javascript (or from the browser). That way,
the app could simply draw to that context, avoiding the security
problems, but I seriously doubt that someone was that thoughtfull when
they were designing the java/javascript interface (yes, they are two
different beasts, by two different companies; they could have given it
more thought, though). I wonder where one might pose this idea for
consideration. Would this be possible via a plugin?