I'm creating a firefox extension. I want to use localStorage as a global variable for whole browser. But it is working only for the tab where it was saved. I'm not able to read this value in other tab. How I can make it to be accessible from any tab, or what may be the possible issues ?
I use it like:
localStorage.getItem('variable')
localStorage.setItem('variable','value')
To be more precise, I'm injecting the javascript code into the page when it was loaded. and from injected code i want to save my value to localstorage.
tabs have different url. and my code is trying to use the localstorage when page loaded. but it checking if the localStorage value exists like this:
if(localStorage.getItem('variable')){ ... }
I don't think you can use localStorage as a global variable
localStorage is also the same as globalStorage[location.hostname], with the exception
of being scoped to an HTML5 origin (scheme + hostname + non-standard port) and
localStorage being an instance of Storage as opposed to
globalStorage[location.hostname] being an instance of StorageObsolete which is covered
below. For example, http://example.com is not able to access the same localStorage
object as https://example.com but they can access the same globalStorage item.
localStorage is a standard interface while globalStorage is non-standard so you
shouldn't rely on these.
Please note that setting a property on globalStorage[location.hostname] does not set
it on localStorage and extending Storage.prototype does not affect globalStorage
items, only extending StorageObsolete.prototype does.
Consider using globalStorage and then setting localStorage where need be.
Source: https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Storage#localStorage
Related
I am storing a value in local storage in one domain. Can I retrieve that value from another domain if I am accessing both domain from same browser?
No, you can't use the local storage of one domain to other domain.
Local Storage is domain based. You can’t read or write from localstorage that’s on different domain even on it's subdomain.
you can use it via Iframe on your subdomain.
Please go through this article Cross-Domain LocalStorage for detailed explanation.
Hope it'll help. :)
Yes, you can use this javascript library.
Bifrost-cors size: <2KB
It's very simple to use, you just need to invoke method.
// In www.exampleA.com site:
var bifrostCors = new bifrostCors("http://exampleB.com/", false)
// In www.exampleB.com site
var bifrostCors = new bifrostCors("http://exampleA.com/", false)
bifrostCors.getLocalStorage("local-storage-key-of-what-you-want")
Actually this lib render the iframe (hidden) and uses window.postMessage to communicate with two different contexts (domain).
You can also implement by yourself but this lib is very very light < 2Kb.
Also not only you can access localStorage you have feature also like.
Get/Set Cookie
Bi-directional message thread
Run JS expression from one domain to other
DOM Manipulation from one domain to other domain ( Iframe )
You may want to take a look at this blog post. It seem to suggest that you can attempt to use an iframe as a workaround to access local storage from another domain.
Disclaimer: I haven't tried it before but it seems interesting. Let me know if it works!
With HTML5 and local storage, can JavaScript be used to save the state of a web page?
For example, some sites have increase font size buttons that are most likely controlled with JS. How can the property be saved so that on a refresh the size stays the same? Or is this done without JS?
Your best bet is probably to use localStorage, unless you do not want the settings to persist upon new sessions (you would use sessionStorage in that case). If you have multiple settings, you can store a serialized representation of your settings.
E.g.
var settings = {
fontSize: '11px',
otherConfig: 'test'
};
localStorage.setItem('settings', JSON.stringify(settings));
//then you can retrieve it
settings = JSON.parse(localStorage.getItem('settings'));
console.log(settings.fontSize); //11px
Note that if you want the settings to persist when users connects from multiple computers, you will have to use some server-side support.
Yes, it is done with Javascript. You can use
Cookies
Sessionstorage
This is a global object (sessionStorage) that maintains a storage area that's available for the duration of the page session. A page session lasts for as long as the browser is open and survives over page reloads and restores. Opening a page in a new tab or window will cause a new session to be initiated.
Localstorage
localStorage is the same as sessionStorage with same same-origin rules applied but it is persistent.
The better/easier ones are sessionStorage and localStorage. The problem is that they aren't supported by old browsers.
Instead, dealing with cookies can be a nightmare, but they work on old browsers too.
Yes can save state to localStorage.
assume you have an object :
var settingsObj={
pageClass:'bigFont',
widgetSortOrder : [1,5,3,7]
}
You could save that whole object to one local storage key by stringifying the object. When page loads you would see if that key exists in localStorage and have your javascript do whatever it neds to with those settings
To stringify and store:
localStorage.setItem('mySettings', JSON.stringify(settingsObj) );
To retrieve from storage and convert to js object
var settings=JSON.parse(localStorage.getItem('mySettings'));
I am only concerned with mozilla's use of localStorage. When i store strings into localStorage
example:
on tab A, I insert:
localStorage["item"] = "hello";
on tab B, I request the same item using
localStorage.getItem("item");
I cannot access this item for some reason in Tab B if i set the the value in Tab A, however i have used the same code in Google Chrome before and it has shown Global characteristics.. why does it not work in Mozilla Firefox the same way?? Other stackoverflow threads have said to use globalStorage but that is a deprecated method according to documentation.
Thanks,
Aiden
What you may try is to set the localStorage value as:
localStorage.setItem("item", "hello");
or
localStorage.item = "hello"
According to the specification all documents with the same origin share the same localStorage data (regardless of the origin of the scripts that actually access localStorage). They can read each other’s data. And they can overwrite each other’s data. But documents with different origins can never read or overwrite each other’s data (even if they’re both running a script from the same third-party server).
This means that you should be able to access the same localStorage date from different tabs.
I'm trying to pass a value from one page to another using localStorage.
Both pages use a common JS file to get/set values from localStorage.
This page sets the value appropriately using localStorage.setItem('key', 'value'): http://example.com/path/index.html
ip is parsed from the query string and written to localStorage with key db_ip.
When I try to do localStorage.getItem('db_ip') on this page, then the item is not there: http://www.example.com/path/page.html
I'm reading specs that say "every Document object whose Window object's localStorage attribute's Storage object is associated with the same storage area", so this makes me think pages can have separate localStorage by having a different Storage object.
I can see the Storage object is different between the two pages. How to I make both pages use the same Storage object?
The localStorage isin't per page, it's by domain. However like #bfavaretto mentionned, www.demandbaselabs.com and demandbaselabs.com aren't considered as the same domain.
Have a look at this answer to see how you can exchange client-side stored data between domains.
ASP .NET is allowed
Storing the values in hidden input fields is allowed
Query String is not allowed
POST request is not allowed
It is possible to store JS variables between GET requests ?
I want to reinitialize them on the client using ClientScript.RegisterStartupScript
Can I use cookies for this ?
Are there other posibilities?
Where cookies are stored when Request is made ?
Can I use cookies for this ?
Yes, see this tutorial on using cookies in Javascript.
Are there other posibilities?
If you are not allowed to append anything the URL of your requests, I can't come up with any.
Where cookies are stored when Request is made ?
In the HTTP request header. The aforementioned tutorial will tell you how to read their values from Javascript. On the server side with ASP.Net, you can read cookie values using Request.Cookie["cookieName"] which returns an instance of HttpCookie.
I wouldn't highly recommend this, but the other option is to alter the window.name property.
You can save some minor bits of data here, then retrieve them on the next page load.
Pros:
Quick-n-dirty, but works
Cons:
Messes up any window references for popups/child iframes
Since its a "hack", browser vendors may break this "feature" in the future
Of course if you can exclude all the old browsers, then use Global/Client Session Storage!
At the moment using cookies is your best bet. You can serialize the JavaScript objects to strings, and unserialize them back into objects later. A good choice format is JSON, since it is a subset of JavaScript.
There is also storing objects in Flash.
Storing in Google Gears.
DomStorage
See this library that has an interface to each:
http://pablotron.org/?cid=1557
If you are in control of all aspects of the page, then you can also wrap the page in a top level frame. Then only refresh the child frame. You can then store content in the parent frame.
You can see this used in sites like GMail, and others where the only thing that changes in the URL is outside the #.
You don't even have to change the URL, that part is just put in for Human Friendly URLs. (So you can actually copy and paste URLs as is).