JavaScript Temporary Storage - javascript

I am writing a Quiz Application and require JavaScript mechanisms to temporarily store data without utilizing MySQL or an Internet Connection. The Game is a Standalone application. What techniques or libraries may be useful for such an application to store game data temporarily in the particular instance of running the JS functionality.
Please provide any references that may be useful.
Much appreciated

If you don't need your data to stay after you leave the page, consider using sessionStorage.
Otherwise, you're fine with localStorage, like I said in the comment, here is a very related answer: https://stackoverflow.com/a/26026430/965907

You can use cookies, but localStorage is a bit more modern and provides several advantages. See https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage for a list of storage options in modern browsers.
localStorage and sessionStorage are very similar, and I'd suggest you just use localStorage. See HTML5 Local storage vs. Session storage for a broader discussion.

Maybe you can use javascript cookies. With them you can keep information with a name for as long as you would like. sessionStorage and localStorage are harder to understand and add to your page, but if you are an expert then you could use those. But as I said, I would recommend using cookies.Good luck with your work!

Related

Is possible to use the browser storage as a data repository?

With Javascript, exist some way to do a data repository (like the repository pattern for example), using the local storage of the browser? If exist, which compatibility issues between browsers will be found?
I believe this is what you are looking for:
http://coding.smashingmagazine.com/2010/10/11/local-storage-and-how-to-use-it/
It explains how to use the local storage on newer browsers(HTML 5 enabled) without the need for cookies.
I dont think it is possible to save data on browser storage.
other things you can do is using other ways to control that.
1st Way:
data you need to save for the entire session of the user you can globalize in your web by just declaring it as Global variable.
2nd Way
You can use the jQuery plugin called Cookie, you can find it in here
cookie will basically means saving for a longer term then the session. and it is ,in fact, saving data on the user's computer.
My personal suggestion : if you absolutely need to save data and a lot of it in a way, i would either suggest you to save it on your sever (if you have any) or by cookie.
If this answer wasn't enough satisfying for you, please comment and i will try to be more accurate and helpful.

Chrome extension, Store data

I've read this question: Chrome Extensions & Javasctipy Database but I want an answer with more details and more clear.
How can I store some of my extension settings?
Is it possible to use a database to do such things with JavaScript?
Is there any good tutorial on it?
I don't want to use Local Storage, because I do not want the behavior of SESSIONS
Thanks.
You could use chrome.storage.sync or chrome.storage.local (docs). Both are local storage (not session storage); sync has the additional advantage that it syncs to the user's Google account if they've connected Chrome to it.
The following page lists the storage mechanisms in HTML5. WebSQL gives you a pretty good database for your javascript to use.
http://www.html5rocks.com/en/features/storage
UPDATE: It has been some time since I posted this. WebSQL has been dropped. Browsers will probably still continue to support it, but all the implementations have been SQLite. IndexedDB is the way to go now. I have used it and it is a little hard to get into, but works well for a client side database.
UPDATE AGAIN: Chrome changing things. See T.J. Crowder's Answer.
I believe this is a simple solution for you if you just want to save some settings. It also has some examples, hope it helps.
https://developer.chrome.com/extensions/storage.html

Sharing data across multiple windows in javascript (client-side)

So let's say I have a website which doesn't require login but I want to be able to track the user's activity based on what they click on my website, and display data accordingly. For example, if they keep looking at children's books to buy, I would recommend similar children's books. Is this possible in javascript?
The only solution I can come up with is cookies, is there a more efficient way?
Thank you.
I hope this is an acceptable question to post on here, as it is not code related
You could use HTML local or session storage. These are both easier to use than cookies.
You can also use Mod­ern­izr for browsers that do not support HTML5.
html5 websockets might be of help.

Is there a wrapper for HTML5 sessionStorage that provides a good compatability implementation?

We would like to use the HTML5 sessionStorage (or something like it) in a new project but you can't rely on it on some browsers. There's this project (http://code.google.com/p/sessionstorage/) which provides an implementation that works a lot of places, yet oddly it doesn't use the HTML5 version if it is available. It always does its own thing.
There's this project (https://github.com/jas-/jQuery.handleStorage) over on GitHub
but its emulation layer is cookies (bleh!).
Note: The above is incorrect, see the answer from jas- below where he explains that I was mistaken about that project.
Is there anything better out there that offers a good implementation like the first project but falls back automatically to HTML5 if it is available? We might retrofit the first project to automatically fall back to HTML5 if available but would rather not build that if there's already a good solution out there.
I know you said that you wanted a solution that did it all but what's wrong with something like this?
if(!window.sessionStorage){
$.getScript("/google_code_sessionStorage.js");
}
There's a couple of YUI utilities for this, depending on whether you're using 2 or 3:
YUI 2: Storage Utility
YUI 3: Storage Lite
Both will use HTML5 session storage if available.
Munsch,
I realize this post is several years old but I wanted to clarify the project you mentioned, I am the author of jQuery.handleStorage and it does not use cookies as its default method of client storage.
If you read the documentation for the project you will see that one of its three client storage options is to use cookies in the event a clients browser does not support the HTML5 localStorage and/or sessionStorage API's.
With that said, if you need a more robust and flexible client storage tool I would recommend secStore.js as it does not implicitly require binding to a form, supports the HTML5 client storage options, gracefully degrades to cookie in the event of a legacy browser and optionally uses the SJCL API to provide transparent encryption of possible sensitive data.
I ended up doing more research on this because I liked both of the answers I got, but I wanted something more like the YUI 3: Storage Lite but that didn't require YUI. Something that was framework agnostic or jQuery friendly would work a lot better for us.
In the end I found a couple of possibilities and one stood out as what we'll try and put to use: Lawnchair
Also considered: store.js, AmplifyJS

Client Side Persistence (Storage)

In my demos, I'd like to avoid using traditional DBs and store all the data on the client side, e.g. information submitted via a form.
What alternatives do I have for that. I've heard about Gears but I don't have any practical experience.
Can I also store binary information besides strings, e.g. an image?
You may have a look on YUI's StorageUtility. It can use HTML 5, Google Gears or SWF on a fallback basis.
Your options are somewhat limited I'm afraid.
Cookies
Depending on your willingness to only use certain browsers you could implement browser based storage
Cookies are the most supported way to go that will work across browsers. I have open sourced a small library for getting and saving data via Cookies via native javascript objects.
http://code.google.com/p/mapbug/source/browse/trunk/app/scripts/cookies.js
you're welcome to copy it and use as you see fit. You'll also need this javascript namespace isolation code if you use it as is:
http://code.google.com/p/mapbug/source/browse/trunk/app/scripts/namespace.js
If you have a large amount of data, you will have to distribute it amoung many different cookies. You can generally depend on being able to save up to 4K of data per cookie.
The YUI StorageUtility is a nice abstraction, as Andy said. Dojo has a similar abstraction dojox.storage which works with some older browsers as well. If your amount of data is < 100 KB, then you can easily just use Flash. Think carefully about using HTTP cookies, as they are not only limited in size, they are sent over the wire, which may or may not be desirable.
I have a very simple demo for testing HTML5's webstorage / localstorage.
http://www.codebase.es/test/webstorage.html
You can store whatever you want, not only strings. To store an image, copy the image into a canvas and save the data using toDataURL() method.
But don't expect it to work on IE...

Categories