html5 localstorage contacts managment web - html

i have to make Contacts management website using html5 local-storage please tell me is that possible in local-storage ? and how and which api to use? if need? please guide me some initial coding step towards it.

Its possible to store the data in local storage .But, you need to think in terms of data size because different web browsers have different storage restrictions.
local storage stores items in key-value pairs and values are in string formats and you need to convert the object to string by JSON.stringify and convert back to object by JSON.parse(string).
localStorage.test="hello"; // here test is key and value is "hello".
var CustomObject={};
localStorage.object=JSON.stringify(CustomObject); store custom object
console.log(JSON.parse(localStorage.object)); //retrieve object and display
in the console.
Most browsers store around 5 mb of data .so ,check the browser support and restrctions.
You can also use sqllite storage to build the html5 application but there is limited support on this by most of the browsers.
see this website for more info http://www.html5rocks.com/en/features/storage

Related

How to store info on client machine without using cookies in JavaScript

I am building a little HTML program (well, not little), but I have got options that I would like to permanently write to the client's machine without using cookies. reason being is cookies will expire, and have a storage limit of 4 KB. how would I do that without jquery.
Client side cookies can be deleted any time. Server side cookies cannot be deleted and the expiration date can be set. You can't write to a machine from an HTML page though, it's not allowable by any means. It would have to be a hack and a virus if such a violation would occur.
You should use HTML5 Local Storage.
To set a item to the storage
localStorage.setItem("person", "jones");
To get the item
var val = localStorage.getItem("person");
To remove the item
localStorage.removeItem("person");
Depending of what browser you use, most have 10mb of storage. read here
The storage can be stored as long as the user or the application allows it. read here
The localStorage can only store values as strings. If you want to store objects like json
var data= { person: "jones" };
localStorage.setItem("jsonPerson", JSON.stringify(data));
To read the json
var data = JSON.parse(localStorage.getItem("jsonPerson"));

Google Polymer: Where is the localstorage?

When we use core-localstorage
<core-localstorage name="my-app-storage" value="{{value}}"></core-localstorage>
where it actually store the data? In some file on the HDD? What is the path?
LocalStorage is one of some ways you can store data in the client end in the Hard-drive, different browsers use different locations to save this file.
LocalStraoge makes use of JSON to store information worth up to 10MB(Might differ from browsers).
Usually, storing and retrieving from Local-storage is done through JavaScript but Polymer team has made a custom element you can use to make this process more Declarative.
Using the core-localstorage element:
<core-localstorage name="HOW YOU ACCESS THIS DATA" value="{{THE ACTUAL DATA YOU WANT TO STORE}}"></core-localstorage>
name attribute is how you access this data, every peice of data you store has to have a name with which you can set or get it's value through.
value attribute is the actual data you want to store, it can be an array, object, number or a string.
More documentations about core-localstorage and localstorage can be found at:
https://www.polymer-project.org/0.5/docs/elements/core-localstorage.html
http://diveintohtml5.info/storage.html

Is it safe to store json object in HTML5 sessionStorage or localstorage?

hi to transfer json object from login page to index page i am storing json object in local storage/Session storage is it safe? if yes how i store >50 mb json object data in local/session storage if not what is the alternative?
Depends on how you define safe (e.g. from external or internal attacks? ) and what you want to save in the Storage.
You have to remember that every User can easily read out and manipulate the local/session storage via browser console.
Ask yourself those questions:
Why do I want to store this data in local storage?
What kind of data do I have? (password, username or whatever)?
Do you really have to store this data in local storage? Most of the time: nope
If the data consist of password, username, email-address, etc. : NEVER STORE IT IN LOCAL STORAGE!
If the data consist of meaningless stuff: Store it if you want to, but is it necessary? See Question 1.
Have in mind that local storage is NOT safe.

Where does ExtJS's store keeps all the data

I want to know where does ExtJS store keeps all the data? I know the data is stored in the memory but I want to know does it used HTML 5 local storage internally or if any other technique is employed?
Thanks,
Deepesh
It depends.
In every case, the data of the store is stored in a Javascript object. The store persists its data via a proxy. It is a matter of configuration how this data is stored. You can configure different types of proxies:
Client side storage
LocalStorageProxy - saves its data to localStorage if the browser supports it
SessionStorageProxy - saves its data to sessionStorage if the browsers supports it
MemoryProxy - holds data in memory only, any data is lost when the page is refreshed
Server side storage
Ajax - sends requests to a server on the same domain
JsonP - uses JSON-P to send requests to a server on a different domain
Rest - uses RESTful HTTP methods (GET/PUT/POST/DELETE) to communicate with server
Direct - uses Ext.direct.Manager to send requests
More details are in the docs.
The data is stored in an in memory collection called a MixedCollection. It's an ordered collection, but it also allows you to look up data by key, so it's like having an ordered hashmap.

store preferences in google chrome extentions

Using firefox, I can store extension preferences using Components.classes["#mozilla.org/preferences-service;1"]
.getService(Components.interfaces.nsIPrefService);
What interface can I use to store preferences in Chrome? And do they get overwritten on an extension update?
Thanks
You can use the localStorage API. See http://code.google.com/chrome/extensions/options.html for an example of building an options page with this, but most simply you can do:
localStorage['foo'] = 'bar'; // Store data
var foo = localStorage['foo']; // Get data
This data won't be wiped out on extension update, either.
The new HTML5 feature to persist data locally (localStorage) should help you here.
In addition to coockies, now there are session and local storage objects, as well as, a simple version of relational database (all storing data on your local harddisk).
One hint when storing/retrieving objects to localStorage ... it is a simple implementation of the Map interface, so the safest way to persist your object is by serializing them via JSON.stringify function and parse retrieved string with JSON.parse.