Friday, December 16th, 2005

Java Applet Storage for JavaScript pages

Category: Editorial

Remember when JavaScript wasn’t called JavaScript? Netscape changed the name for marketing reasons, and the confusion began. One of the features we got was “Live Connect”. The ability to talk between any Java applet, and our Java applets.

This should sound familiar to the Flash/JavaScript bridge that allows you to talk bidirectionally between those two platforms.

Dojo 0.2. comes with a storage package for Flash, and maybe it would be nice to have a storage provider that uses a Java applet (and eventually uses the native browser APIs that are being specified).

Java Applet Storage

It is trivial to use the Applet/JavaScript bridging. Let’s first look at a simple applet storage example. This example allows you to put any String into an applet storage.

The Java Applet

You can create a simple applet to store data:

import java.applet.Applet;
import java.util.Map;
import java.util.HashMap;
import java.util.Date;

/**
 * @author Dion Almaer
 */
public class JsStorage extends Applet {
    private Map<String,String> map = 
       new HashMap<String, String>();

    public String get(String key) {
        return map.get(key);
    }

    public void set(String key, String value) {
        map.put(key, value);
    }

    public void setDatedMessage(String key, String value) {
        set(key, "Message: " + value 
         + ", was set on me on the date: " + new Date());
    }
}

The JavaScript

To plug into this, we create a bit of JavaScript wrapping:

var applet;

window.onload = function() {
    applet = document.getElementById('jsstorage');
}

function setMessage() {
    userinput = document.getElementById('userinput');
    applet.setDatedMessage("date", userinput.value);
}

function getMessage() {
    return applet.get("date");
}

The HTML

Now we setup the applet and widgets to tie into things.

<applet id="jsstorage" codebase="applets" code="JsStorage.class" 
mayscript="true" border="0" height="1" width="1"></applet>

<input type="text" id="userinput" value="" />

<input type="button" onclick="setMessage();" 
value="Set Message"/>

<input type="button" 
onclick="document.getElementById('returnvalues').innerHTML=getMessage();" 
value="Get Message"/>

<h3>Return Values From Storage</h3>

<div id="returnvalues"></div>

Resources

NOTE: This doesn’t even get into the JsObject which allows us to talk back from the applet to the JavaScript world!

Posted by Dion Almaer at 2:13 pm
6 Comments

+++--
3.3 rating from 7 votes

6 Comments »

Comments feed

This is interesting. Came across something similar, but using Flash as a persistent storage mechanism, a short while ago. I suspect that the applet approach provides only transient storage (cache). Right?

Here is the link to the Flash storage approach:
http://www.sysbotz.com/articles/jsdb/index.htm

Comment by Raj — December 16, 2005

I don’t get it. The applet doesn’t offer any form of persistance, not even persistance for the session. If I reload the page, my stored message is gone. If I visit another page and come back, my stored message is gone.

I don’t see how this is any different than storing data in the properties of a JavaScript object. Am I missing something?

I tried to do a Java-based persistence storage mechanism using java.util.prefs.Preferences, but alas, applets are not allowed to use this class.

Comment by David Flanagan — December 16, 2005

in IE you have, of course, userdata at your disposal. 10x 64KB of xml if i remember correctly.

one more reason why ie has been the best for developing web apps since ie50 came out.
it still is.

Comment by lon — December 17, 2005

If you just want a transient session cache, which is what this applet seems to offer, you can simply use a hidden form field and push data into there. It turns out that all modern browsers will autosave this text, so that users won’t lose text they have entered into forms. This can be used to good effect, using the hidden form field’s autosave features to cache data on the given page that will persist even if you leave and then navigate back using the back and forward buttons. Note that the form element has to be create with document.write() on page load rather than using the DOM methods. I use this to good effect in the Really Simple History to catch some important boundary conditions to help provide better history and back/forward button support.

I’m in the process of making many of these different storage types more accessible in dojo.storage, hiding them behind a consistent hashtable abstraction that is backed by different kinds of Storage Providers, such as a FormStorageProvider using the technique above, an IEStorageProvider using the proprietary IE storage features described in another comment, a FlashStorageProvider to provide the features in AMASS, etc. Now all I have to do is finish it ;)

Brad Neuberg

Comment by Brad Neuberg — December 17, 2005

Yes, userdata still is the best cookie alternative. Lean and mean and with practically no code, you can store 64K data per page for 88% of the visitors.

Comment by martin — December 20, 2005

Nobody seems to have READ the commentary – this is only a demonstration of the communication capabilities between JavaScript and Java applets. It is not meant to store data, it is simply there to DEMONSTRATE!

Yours,

Gratemyl

Comment by Gratemyl — December 21, 2005

Leave a comment

You must be logged in to post a comment.