How can I change the values of variables in a website's JavaScript code?

Question

I want to know because I'm building a website at the moment and, as part of the code, I have a variable whose value has important consequences for the functionality of the website. Hence my desire to know how someone can change this value (even if it only affects the website as it appears to that user).

I am particularly interested in learning how to do this in Google Chrome.

is it your own website that you are trying to change? if not, it's unlikely that changing things in your browser will affect anyone but yourself; if you are hoping to find someone to explain how to hack a website here, you are on the wrong site. — Claies
– Claies, Commented Aug 5, 2016 at 22:26
@Claies I want to learn how to change the values of variables in the JavaScript code of my own side so I can build more robust code. — user5508297
– user5508297, Commented Aug 5, 2016 at 22:28
Sorry, I've been unclear. I want to know because I'm building a website at the moment and, as part of the code, I have a variable whose value has important consequences for the functionality of the website. Hence my desire to know how someone can change this value (even if it only affects the website as it appears to that user). @Claies — user5508297
– user5508297, Commented Aug 5, 2016 at 22:32
you can't stop users from using the browser tools on their pc, so if you believe this value has important consequences, you should ensure that it is thoroughly validated on the server. If this isn't enough security, and changing the variable is a problem for your application, then perhaps you should consider something other than a web application for this sensitive information. — Claies
– Claies, Commented Aug 5, 2016 at 22:36
knowing how they could change the value won't give you any power to stop it from happening. — Claies
– Claies, Commented Aug 5, 2016 at 22:37

CoconutFred · Accepted Answer · 2016-08-05 22:30:41Z

6

If you hit F12 in chrome and click on "Console" at the top, you have a fully functional JavaScript interpreter living in the scope of the website you're looking at. This means you can enter pretty much any code in the console and execute it as javascript code in the global scope of that website. Global variables in <script> tags are exposed in this scope, so if you have (for example) in your page:

<script>
var x = {'a': 5};
</script>

You can type in x.a = 6 in the console, press enter, and the variable will indeed be changed.

You can even use the console to change the values of builtins, like Array.map, though this is not recommended as it can change or break the functionality of website code.

answered Aug 5, 2016 at 22:30

CoconutFred

4545 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Bergi Over a year ago

Dev tools do not only allow access to global variables, but to any variables.

user5508297 Over a year ago

@Bergi I'm trying to change the variables in a script that was injected via a Google Chrome extension into a pre-existing webpage but I keep getting ReferenceError: variableName is not defined(…) - am I missing something?

Barmar Over a year ago

The variable may be a local variable of a function. To access it, you need to set a breakpoint in the function so that the variable will be in scope.

Collectives™ on Stack Overflow

How can I change the values of variables in a website's JavaScript code?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related