Chris Pollett > Students >

    ( Print View )


    [Project Blog]

    [CS297 Proposal]





    [CS297 Report (PDF)]

    [CS298 Proposal]

    [CS298 Report (PDF)]

    [CS298 Source Code (ZIP)]


Deliverable_4 - Test Application connecting data url to HTML5 storage

Test Application using data url accessing HTML5 Local Storage

I tested if data url work with HTML5 local storage in this deliverable. First I tried to convert the Flower Picker game created earlier into data URL as it has all the functionality. But it did not work, hence I thought of creating a tester small application to test if it works

Test application is a data url which just initializes local storage, sets the value and gets the value

window.onload=function(){ alert("hi"); localStorage.setItem("highscore1",0); alert("stored"); alert(localStorage.getItem("highscore1")); };

When I carried out the experiment different browsers gave me different results.

Firefox - Worked Chrome - Did not work Safari on iPhone - Did not work Android web browser - Did not work

When I looked into the error console of chrome, I saw Security Exception which was thrown by localStorage api. SecurityError exception is thrown whenever any of the members of a Storage object originally returned by the localStorage attribute are accessed by scripts whose effective script origin is not the same as the origin of the Document of the Window object on which the localStorage attribute was accessed. There is some workaround for this method.

Professor Pollett asked me to check if local storage is accessible from bookmarklet or not.

A bookmarklet is Unobtrusive JavaScript stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. Web browsers use URIs for the href attribute of the tag and for bookmarks. The URI scheme, such as http:, file:, or ftp:, specifies the protocol and required form for the rest of the string. Browsers also implement a prefix javascript: that to a parser is just like any other URI. Internally, the browser sees that the protocol is javascript, treats the rest of the string as JavaScript code which is then executed, and uses the resulting string as the new page. The executing script has access to the current page, which it may inspect and change. If the script returns an undefined type (rather than, say, a string), the browser will not load a new page, with the result that the script simply runs against the current page content. This permits in-place font size and color changes, for example, without a page reload Bookmarklet used: javascript:(function() { alert("hi"); localStorage.setItem("highscore1",0); alert("stored"); alert(localStorage.getItem("highscore1")); })();

I also got different results for bookmarklet It worked for Chrome and Safari - iPhone but failed on Firefox and Android web browser. We have to get a workaround working or find out some other way to give the game native app feel,