blogger page password encryption in javascript

Question

how can i encrypt this password protection for blogger page ? or add a function maybe ...so it wont be so obvious in the code.

and is there anyway that i could add some css design to it ? or make it to popup in the center of the screen.

<!-- paste this password form in your blogger post/page -->
<script language="JavaScript">
var password = ' '
password=prompt('This is password protected page, please enter password to continue.','');
if (password != 'password') {
location.href='https://errorpage.blogspot.com/404';
}
</script>
<!-- end password -->

ps : im new with JavaScript , still learning...

Image : https://i.stack.imgur.com/8mFpN.png

this is how the form looks like , but anyone could just access the code ( Ctrl + U ) and see the password ...

JS has visible source, so you need back-end to validate/encrypt password. What back-end you are using? — Justinas, Apr 14 '20 at 15:38
is not secure, one could simply bypass it with a local file overide, but to answer hash the password with something like https://github.com/brix/crypto-js — Lawrence Cherone, Apr 14 '20 at 15:38
@LawrenceCherone But it still requires either plain password in code or some back-end (even in NodeJS — Justinas, Apr 14 '20 at 15:40
no it dont, `if (computeHash(userSupplied) === 'somePreComputedHash')` — Lawrence Cherone, Apr 14 '20 at 15:41
@LawrenceCherone But then again, `computeHash()` needs some "salt" or something. I think in plain JS you can reverse engineering hash. — Justinas, Apr 14 '20 at 15:49
Simplest solution I think would be httpasswd if using Apache — Justinas, Apr 14 '20 at 15:50
sure, salting would add more entropy, and choosing md5 would be a bad choice, but is no diff from serverside logic, except you not pulling the computed hash from a db and hash is public.. in the past I've seen people AES the entire documents source and works well as long as its *pre-computed* / hardcoded and not done in code which can be bypassed, just because its clientside does not make it insecure — Lawrence Cherone, Apr 14 '20 at 15:54
i just started with java Script tho , i wanted to do something simple like md5 encryption or any other easy to do , cuz its a bogspot page and it got no database + the code is exposed , i wanted a one way encryption if the value of user-type matches the exact value then it lets u in. — iifast2, Apr 14 '20 at 18:20
@Justinas Im using Blogger / Free Blogspot page , the code is exposed out there , so thats why i asked since i know a lil about Jscript — iifast2, Apr 14 '20 at 18:22

score 1 · Accepted Answer · answered Apr 20 '20 at 11:46

You can Hide whole page via css and then use js to show it. Enter below code before /head and see magic

<div style='position:fixed;overflow:none;height:100%;bottom:0;width:100%;top:0;display:table;text-align:center;background:hsla(0, 0%, 0%, 0.72)' id='passward-protected'>
<div style='display:table-cell;vertical-align:middle'>
This Page is password protected
<button onclick='enterpass()'>Enter Password</button>
</div>
</div>


<!-- paste this password form in your blogger post/page -->
<script language="JavaScript">
function enterpass(){
var password = ' '
password=prompt('This is password protected page, please enter password to continue.','');
if (password == 'password') {
document.getElementById('passward-protected').style.display='none';
}else{
alert('Wrong Password')
}
}
</script>

this is really helpfull! thank you , I did adjust the opacity , Its good like this , but how can I adjust the table cell on the right , I didn't paste it before because it's a blogger page and I dont want it in every page , only in a specific one. https://i.imgur.com/0uZ87nH — iifast2, Apr 20 '20 at 14:54

blogger page password encryption in javascript

1 Answers1