Keeping a global value in the next page [duplicate] - javascript

I want to send some data from one HTML page to another. I am sending the data through the query parameters like http://localhost/project/index.html?status=exist. The problem with this method is that data remains in the URL. Is there any other method to send the data across HTML pages using JavaScript or jquery.

why don't you store your values in HTML5 storage objects such as sessionStorage or localStorage, visit HTML5 Storage Doc to get more details. Using this you can store intermediate values temporarily/permanently locally and then access your values later.
To store values for a session:
sessionStorage.setItem('label', 'value')
sessionStorage.getItem('label')
or more permanently:
localStorage.setItem('label', 'value')
localStorage.getItem('label')
So you can store (temporarily) form data between multiple pages using HTML5 storage objects which you can even retain after reload..

I know this is an old post, but figured I'd share my two cents. #Neji is correct in that you can use sessionStorage.getItem('label'), and sessionStorage.setItem('label', 'value') (although he had the setItem parameters backwards, not a big deal). I much more prefer the following, I think it's more succinct:
var val = sessionStorage.myValue
in place of getItem and
sessionStorage.myValue = 'value'
in place of setItem.
Also, it should be noted that in order to store JavaScript objects, they must be stringified to set them, and parsed to get them, like so:
sessionStorage.myObject = JSON.stringify(myObject); //will set object to the stringified myObject
var myObject = JSON.parse(sessionStorage.myObject); //will parse JSON string back to object
The reason is that sessionStorage stores everything as a string, so if you just say sessionStorage.object = myObject all you get is [object Object], which doesn't help you too much.

possibly if you want to just transfer data to be used by JavaScript then you can use Hash Tags
like this
http://localhost/project/index.html#exist
so once when you are done retriving the data show the message and change the
window.location.hash to a suitable value.. now whenever you ll refresh the page the hashtag wont be present
NOTE: when you will use this instead ot query strings the data being sent cannot be retrived/read by the server

Well, you can actually send data via JavaScript - but you should know that this is the #1 exploit source in web pages as it's XSS :)
I personally would suggest to use an HTML formular instead and modify the javascript data on the server side.
But if you want to share between two pages (I assume they are not both on localhost, because that won't make sense to share between two both-backend-driven pages) you will need to specify the CORS headers to allow the browser to send data to the whitelisted domains.
These two links might help you, it shows the example via Node backend, but you get the point how it works:
Link 1
And, of course, the CORS spec:
Link 2
~Cheers

Related

Reopen Dexie Database with Tampermonkey

As per my previous post, I was referred to create a new post.
As seen in the comments, there is a trail of progression for the issue, I'll rephrase here in this post:
I'm using a TamperMonkey script in FireFox.
I'm trying to persist a Dexie object/database into TamperMonkey's local storage with GM.setValue('unique-dexie-db-name', dexieDBvariable);
However when I go to retrieve this value (ex. I store this on google.com, and retrieve this on yahoo.com) with var dexieDB = GM.getValue('unique-dexie-db-name'); My returned object value is not a Dexie database object, but rather something else I can't use as a database.
My question: I'm unsure, but I think when storing this Dexie Database into TamperMonkey, it gets stored as a string, and, I should try to somehow JSON.stringify() the object fully in order to be able to reproduce and re-create it when I need it in the GM.getValue() call. How do I store this Javascript object as a string in order to be able to retrieve the value again as a whole later?
This is my working example code;
https://gist.github.com/n-bell/b375c80b638d3a59a250e903afb4a36b.js
https://gist.github.com/n-bell/b375c80b638d3a59a250e903afb4a36b
(second link looks better formatted in browser)
And, as stated before, I've tried playing around with JSON.parse() / JSON.stringify() but I'm not sure this is the path to go down.

What is the right way to pass array of objects with redirect?

I'm using node.js and I need to pass an array of objects with res.redirect(),
I tried with querystring but it's not a good idea because the array with too big and I could get Error 414 Request URI too long.
using connect-flash isn't a good way either, it's more useful for passing messages.
And I don't want to use req.app.locals for that.
Hope you can help me with any idea.
Assuming the client here is a browser that you want to just automatically follow the redirect and then inherit some new state when the server generates the page for that newly redirected URL, then here are some options:
If you already have a session established for the user, then you can store the data in the session, then include a single query parameter that tells the route handler for the page you're redirecting to to look in the session to get the relevant data.
You could also create a temporary server-side cache of data. Generate a random key (likely a timestamp plus a random number). Store the data in a server-side Map using that key. Then put the key into a query string on the redirect. Then, in the route handler for the new, redirected page, it will see the query string parameter and it can grab that key out of the query string and access the data from the server-side Map serving as a temporary cache (and probably remove it from the cache too). This scheme works in a session-less environment.
You then need some scheme for cleaning up unused data from the cache so it doesn't accumulate. Probably what makes sense it to timestamp the data and then have a setInterval() timer that just removes things from the Map if their timestamp is older than xx minutes.
If the request is an Ajax call rather than a regular browser page request, then you don't need to use a redirect at all. You can just return the content that they would have gotten if they then followed your redirect. Then, you don't have to invent a temporary place to store the data. You can just use the data to generate the desired page and return it.
Store the data as session data and serve it back up to them when they land on the landing page.
Another way would be to have the client request the data asynchronously once the redirect has been performed.

Send values from django server to client?

I would like to give some values to my client (to use them in javascript) from my django server.
I know that I can use cookies, but the problem is that they are kept for all request whereas I need them only once when the client loads for the first time (it is not really a problem).
I could also pass those values to the template to render some html tags with the "data-value-name" properties set the the values (for example <body data-name="joe" data-id="123456">)
Both solutions work fine, but is there a better method?
What I usually do is to create a <script> element where I render the values directly to JavaScript objects stored in local or global variables.
If you have a lot of values you can also consider implementing a view that returns JSON which is requested via ajax from the client.

Alternative to passing Data to JavaScript from PHP?

I have a fairly large Application and I'm currently trying to find a way around having to pass Data from PHP (User Tokens for 3rd Party API's and such) through the DOM. Currently I use data-* attributes on a single element and parse the Data from that, but it's pretty messy.
I've considered just making the contents of the element encoded JSON with all the config in, which would greatly improve the structure and effectiveness, but at the same time storing sensitive information in the DOM isn't ideal or secure whatsoever.
Getting the data via AJAX is also not so feasible, as the Application requires this information all the time, on any page - so running an AJAX request on every page load before allowing user input or control will be a pain for users and add load to my server.
Something I've considered is having an initial request for information, storing it in the Cache/localStorage along with a checksum of the data, and include the checksum for the up-to-date data in the DOM. So on every page load it'll compare the checksums and if they are different (JavaScript has out-of-date data stored in Cache/localStorage), it'll send another request.
I'd rather not have to go down this route, and I'd like to know if there are any better methods that you can think of. I can't find any alternative methods in other questions/Google, so any help is appreciated.
You could also create a php file and put the header as type javascript. Request this file as a normal javascript file. <script src="config.js.php"></script> (considering the filename is config.js.php) You can structure your javascript code and simply assign values dynamically.
For security, especially if login is required, this file can only be returned once the user is logged in or something. Otherwise you simply return a blank file.
You could also just emit the json you need in your template and assign it to a javascript global.
This would be especially easy if you were using a templating system that supports inheritance like twig. You could then do something like this in the base template for your application:
<script>
MyApp = {};
MyApp.cfg = {{cfg | tojson | safe}};
</script>
where cfg is a php dictionary in the templating context. Those filters aren't twig specific, but there to give you an idea.
It wouldn't be safe if you were storing sensitive information, but it would be easier than storing the info in local storage,

Using PHP - is it possible to set SessionStorage in the browser?

Im pulling in a $_SESSION variable coming from my database, either: $_SESSION['lvl'].
After the level is fetched, I'd like to store that variable in the browser's session as key value pairs using the sessionStorage API; is this possible?
I do not see any docs or info as it looks like this is only possible using JavaScript.
I'd like to set it within my PHP service.
Any advice is appreciated.
Well, you need to produce Javascript code that will do it on the client, and it's gonna be a pain to get the value on the server side.

Categories

Resources