Prevent browser from remembering JS variable after page refresh - javascript

I've looked at several questions asking how to remember the variable, but I'm having the opposite problem which is surprising to me.
My main.js file will have this:
console.log(name);
and I get nothing. If I try to log it in the console it returns undefined, that is expected,
now I create the variable like this:
var name = "Sandy"; //global variable
console.log(name); //returns "Sandy" which is also expected.
But now the unexpected happens. I remove the variable so we're back to this, and then I refresh the page:
console.log(name); //This returns "Sandy" still...
How is this happening and why? I thought it was cookies, so I tried it in incognito mode (Maybe I misunderstand incognito?) But it works exactly the same.
In order to make the variable go away I have to close down the browser and open up a new window.
After reading briefly about LocalStorage, cookies, and incognito, it sounds like cookies are the problem, but wouldn't I have to create the cookie manually?
It seems like the browsers should be forgetting the variables unless I explicitly set the variable to a cookie.

By declaring a global variable called name you are overwriting a window.name property, which doesn't reset on page refresh.
window is a built-in object, specific to each opened tab in a web browser and represents a containing document. You can read more about the window object here and more about its name property here.
You can also check what happens during execution of your code by logging window.name before and after you define your variable.
It's best to avoid using name as a variable in JavaScript code that runs in a browser. Set your variable to something else (that is not a reserved word or a propery name of a built-in object) and your code will work.

Related

Cannot access local variable in console when debugging reactjs in browser

When debugging js in browser, usually you put a breakpoint, and when the code hits there, you can access all local variables no matter your mouse hovers on it or you just type the variable name from the console (because you are in the execution scope)
But it seems to behave differently in react since I am able to see all local variables. However I cannot access them from the console or change its value from the console. Refer to the screenshot below.
So I can access url but cannot access response or timeTakenByFetchApi
My understanding is that console.log will be executed straight away, even though the promise has not returned anything.

JavaScript – Security overwriting variable by user

I have a variable in JavaScript:
var userIp = '192.168.0.1';
However, user can open browser console and overwrite it:
userIp = '123.45.127.21';
How I can lock this variable, to user can't change it value? Is it possible?
How I can lock this variable, to user can't change it value? Is it possible?
No, it isn't. You can make it harder by making the variable not a global, but it's still not remotely hard.
Client-side code is completely and totally insecure. Users can change values of variables, modify code, completely replace the code, etc. They can also manipulate the page contents. Anything the client side sends to the server may be spoofed, and so the server has to treat everything it receives as potentially-compromised.

jQuery/Javascript Cookies and variable returning with value [object Object]

I am attempting to set a cookie to a site using jQuery, ONLY if the user came from a specific site. In this case, lets use -http://referrersite.com- as the site they must come from for the cookie to be created as an example. The cookie value is being stored in a variable and everything up to this point is working fine.
There is a conditional statement checking whether the user came from the referred site, if the cookie exists already and if the cookie doesn't exist and the user did not come from the referred site. If the user came from the referred site the cookie is created and stored in a variable. If the cookie already exists, it is then stored in a variable. If the cookie does not exist and the user did not come from the referred site I am assigning the variable a static string of characters - this is where the issue lies.
When the variable is alerted from the non referred site and no existing cookie, it returns: [object Object], not the static string of characters.
The code I am using is below:
$(document).ready(function() {
var referrer = document.referrer;
if(referrer == "http://referrersite.com") {
$.cookie("code","123456", { expires: 90, path: '/' });
cookieContainer = $.cookie("code");
alert(cookieContainer);
} else if($.cookie("code")) {
cookieContainer = $.cookie("code");
alert(cookieContainer);
} else if($.cookie("code") == null && referrer != "http://referrersite.com") {
cookieContainer = "67890";
alert(cookieContainer);
}
});
In conclusion, my goal is to set cookieContainer with the string "67890" if the user did not come from the referred site, and $.cookie("code") does not exist. For some reason it is containing an object instead.
Please let me know if there is something I am missing as the code to me looks like it should work.
Thanks!
[Object Object] In short means the data in the cookie isn't a string, well not exactly. Chances are the data in the cookie more so resembles that of a JSON string/object. And to alert it out, print it on screen, or whatever it is your trying to do in the long run your going to have to either do a loop over the object and have it print it all out.. or if you know which property you want specifically you will have to call it specifically.
eg:
if(cookieContainer.property_name_whatever)
{
alert(cookieContainer.property_name_whatever);
}
To find out the individual properties I would say your easiest bet with javascript is using Firefox, install the Firebug http://getfirebug.com/, and in your code instead of alert(cookieContainer) do console.log(cookieContainer) . After enabling the console with firebug, this will read the object as a whole and display the data on a per property => value basis.
The reason something exists when its not the cookie your looking for is its likely the person on the site came from another site or search engine. In using document.referrer any url landing to your page even internals can and likely will be treated as a referrer, its ultimately dependant upon the browser itself though, as all the major ones support it, they all treat it differently in various degrees. Im not going to lay claim completely understanding that particular object as I dont use it often myself. But to quote W3
Definition and Usage
The referrer property returns the URL of the document that loaded the
current document.
The URL in mention could even be you on the same site jumping back and forth between pages via links on your page (Not sure if that applies on reloads/refreshes, but it could I suppose)

How to achieve the role played by "public static variables of Java" in JavaScript or a webpage?

On my homepage I have to set a cookie using the name of the logged in user. The cookie set and get part has to be done in JS. On the subsequent sub pages I have to retrieve the cookie(username) using the set variable name.
How can I store the username/cookie name so that it is publicly accessible across all the pages? This username will obviously change with each new user and is not constant.
I have tried doing this using external JS file but in every new page the value is reset to default which I don't want.
The exact solution to my problem is like the work done by:
public static variable
in Java (not final). I want to achieve this in JS.
There is no such thing in Javascript unless you use a storage API (client side storage, or cookies, or something like that). The reason is that when you move from one page to another, it doesn't particularly matter to the browser. It wipes its slate and starts over, keeping explicitly stored data like cookies and such, and deleting everything else that is dynamically created. So the short of it is, if you want each page to know the name, you have to include the name in each page's code (manually or via script).
I don't quite know your application. In javascript you have function prototypes. In a function prototype you can declare 'static' members like so:
function C(params for constructor){
C.aStaticVariable = 5;
}
alert(C.aStaticVariable); //available everywhere

Javascript top level object - window doesn't seem to cut it

Hey JS gurus... I am juggling w/ some crazy weird google map stuff. I need to store 2 numbers (lat/long), click on a pin, and on the new page, use these numbers.
So I tried to store these in the good ole' window:
window.lat = ...;
window.lng = ...;
however, the window after the click on the map is not the same window that holds our lat, lng.
So the question is: does our 'new' window hold a reference to the one that has out lat/lng? I tried window.top, window.parent, window.frames, it's all equal to window...
Alternatively, where can I store those values to be able to restore them later?
You cannot persist Javascript variables across pages.
Instead, you should use a cookie.
You need to look at cookies/sessions to hold values over different pages:
JavaScript Cookies: (note i've never actually used these, but presume this info is up to date)
http://www.quirksmode.org/js/cookies.html
Sessions: (PHP as example, but all server-side languages support sessions)
http://www.tizag.com/phpT/phpsessions.php
Either you have to use Cookie or you should pass these numbers as URL variables.
Every time you load the Window the complete DOM be written again, that's why your variables no more exist after page reload.

Categories

Resources