javascript: hiding contents of key

Question

In the code below I want to hide the contents of the key(speaker) key being viewed by browser console.

var App_Version = 1; 
var App_id = 35; 
var Speaker = "password";

You can't, the only thing you can do is to hash the password, you can use MD5. — jcubic, May 28 '15 at 08:31
The only way to keep the key safe would be for it to stay server side through something like php. — Grallen, May 28 '15 at 08:33
@jcubic i want to know other possibilities iam using the above code in angularjs — Visakh B Sujathan, May 28 '15 at 08:40
If you have javascript that's executable by a browser, then anyone using your page can view and see what it is too. If you want to keep things secret, don't send them to the client. — James Thorpe, Jun 01 '15 at 12:43
easy: with `(function(){var Speaker = "password"; /*do stuff with Speaker*/ }());` you cannot view Speaker's contents in the console. (though you can still set breakpoints) — dandavis, Jun 08 '15 at 09:11
if that anon function is defined in a file, how would you see it from the console? — dandavis, Jun 08 '15 at 09:17
@dandavis in browser select inspect element>sources codes are visible — Visakh B Sujathan, Jun 08 '15 at 11:41
ahh, i thought you meant the console, not devtools at large... — dandavis, Jun 08 '15 at 18:59

score 8 · Answer 1 · edited Oct 20 '20 at 04:04

8

If var Speaker = "password"; is hardcoded somewhere in your client code, you are out of luck. See Password encryption at client side, and Howto hide Credentials in a pure Javascript HTML Web App and Is it worth hashing passwords on the client side because everyone will say not to hide/obfuscate a password on the client-side.

However, If you really, really just want to remove the password altogether from your client code, then use a server-side script to "proxy" your AJAX request and silently add the password as a POST parameter (for example) in transit to the true destination. See Angular REST API security

If you are adamant about using some kind of crypto on the client-side, I found angularjs-crypto which is an "AngularJS module for decryption/encryption of JSON in HTTP requests/responses". It is based on crypto-js. I still strongly against taking a hardcoded password and encrypting it on the client-side, however.

edited Oct 20 '20 at 04:04

Derek Wang

10,098
4
18
39

answered Jun 05 '15 at 17:34

Drakes

23,254
3
51
94

it seems to be not the actual solution,Thank you for the tip – Visakh B Sujathan Jun 11 '15 at 10:12
We can still help you. We just need more details of what you truly want to do. Otherwise, use a server script proxy to add the password in transit. – Drakes Jun 11 '15 at 11:15
Write up some code. Put it in a fiddle. We'll look at it. – Drakes Jun 11 '15 at 12:44

score 1 · Answer 2 · answered Jun 01 '15 at 12:43

1

Well you can't "hide" javascript.

You can encrypt it with an obfuscator but most people can decrypt it using a beautyfier. However check this out:

OBFUSCATOR

answered Jun 01 '15 at 12:43

Joakim M

1,793
2
14
29

OBFUSCATOR can be easily decrypted – Visakh B Sujathan Jun 01 '15 at 13:00
3

Thats what I wrote :) – Joakim M Jun 01 '15 at 13:20
if we use facebook login in angularjs.how to hide the credentials – Visakh B Sujathan Jul 07 '15 at 09:44

score 1 · Answer 3 · answered Jun 01 '15 at 12:49

There is no way in Javascript to hide the contents of a variable without unsetting the variable, which is of no use to you if you need to reference whatever that value was later. A few options to choose from, depending on exactly what you need would be this:

Hashing the value

You could has the value with MD5 or SHA. This way the user doesn't know what the value is but you can still send it off to the server and store it that way

Store the value on the server

You could store the value on the server and reference it with some sort of key. That way the user never sees the actual value, they are just checking the server to see if the value they have matches what the server has.

If this is a password that is being generated and we never want the user to see it, your best bet is to handle all of that on there server, this way there is no chance the user will ever even have the value on the client side.

score 1 · Answer 4 · answered Jun 01 '15 at 12:52

Javascript code is considered temperable so you can't really hide a password in your code. The best practice is to use oAuth2 which uses temporary tokens(to defer from passwortds) that in conjunction with things like CSRF can make you client side code more secure. Here's one library that can help you do that in JS. It does require that on your server side when accessing resources you need to validate that token (preferably on every call). To some it up if you need to store a password on the browser in order to log into a server - don't. Let the user log in and the afterwards use the token issues by the server or use a third party login and use the token you got from the third party authentication server.

it seems to be not the actual solution,Thank you for the tip — Visakh B Sujathan, Jun 11 '15 at 10:12

score 1 · Answer 5 · answered Jun 05 '15 at 15:47

Nice question even I had came across such situation where my API key and authentication token was visible at client side.Obfuscating a client side Javascript file is best option. You can use UglifyJS for obfuscating the clientside code. And also there must be permissions on the server side for creating and deleting objects.

score 0 · Answer 6 · answered Jun 01 '15 at 12:45

0

although it's not fully clear from the small code provided, protecting it from the browsers console is straight forward IF we are only talking about someone console.logging the value (as your question seems to hint).

you can put it inside a closure, something like a revealing/modular pattern:

var app = (function () {

    var Speaker = "something";
    // only available on app declaration as the function is immediately called
    return // some object/function protecting the speaker value
})();

console.log(Speaker); // gives an error
console.log(app.Speaker); // gives an error

This of course only stops someone using basic dev tools like console.log, it wont stop someone adding breakpoints. the nature of javascript I'm afraid

answered Jun 01 '15 at 12:45

atmd

7,430
2
33
64

i mean using browser inspect method we can view the js code – Visakh B Sujathan Jun 01 '15 at 12:51
I see, then as others have said, no, it can't be hidden. if the browser can't see it then it can't run it. having said that, anything secure like a password should/would be encrypted anyway. a server solution is the better method here. maybe if the problem was described we can better understand the purpose – atmd Jun 01 '15 at 12:52
in the case of using angularjs in frontend how can secure it – Visakh B Sujathan Jun 01 '15 at 12:55
secure what? what are you trying to secure? the whole code? if you dont want people to see the code thats created the application then flash is a good option, or javaFX, but certainly not javascript – atmd Jun 01 '15 at 12:56
but there are many tools that can get to that information regardless of the javascript code. if you are trying to protect post information then that is a very different question. are you on a ssl? – atmd Jun 03 '15 at 07:22

score 0 · Accepted Answer · answered Dec 01 '17 at 09:59

0

using jwt we can encrypt data.try this link

answered Dec 01 '17 at 09:59

Visakh B Sujathan

229
1
4
25

score -1 · Answer 8 · answered Sep 11 '17 at 08:57

-1

Well you can't "hide" javascript. but you can encrypt them using OBFUSCATOR and other tools

answered Sep 11 '17 at 08:57

Visakh B Sujathan

229
1
4
25

javascript: hiding contents of key

8 Answers8

Linked