Show HN: Password-protect a static HTML page

https://robinmoisson.github.io/staticrypt

by yoble • 9 years ago

348 149 9 years ago

robinmoisson.github.io

ezekg• 9 years ago

Now make a WP plugin and you're set!

ComputerGuru2• 9 years ago

WordPress has access to server-side scripting, why would you use js encryption there?

unknownid• 9 years ago

- Allows transferring encrypted data over an insecure network - Page can be loaded online and decrypted/read offline later - Server cannot track who successfully decrypted the information - If server is compromised by a third party, they cannot retrieve the encryption key from users viewing the document - Among other things

devy2• 9 years ago

I remember 3-4 years ago when I was working with a major wall street financial company to integrate with their credit card processing gateway, some of the private and sensitive information (contracts, testing reports etc.) had already been communicated with a similar but proprietary AES 256 based encryption on a static HTML page via email attachments as a way of secure communication. The intended recipients would get an invite to their site to register/login to get the passphrase to unlock the encrypted static HTML doc. This could have been the standard practices in many financial firms theses days (when they are not using PGP/GPG encrypted emails)

Edit: redacted the name of company.

wyc2• 9 years ago

I believe SendSafely (https://www.sendsafely.com/) claims to have a somewhat secure/streamlined implementation of this. Browser non-plugin JavaScript crypto is always sketchy, but possibly better than nothing if the limitations are correctly communicated to the user.

devy2• 9 years ago

SendSafely's workflow is quite different[1] from what I described with the encrypted static HTML email attachment. And I don't like the idea of sharing the confidential data over 3rd part cloud storage even if it's encrypted.

[1] https://www.sendsafely.com/howitworks/

cdevs• 9 years ago

I could see some other nifty concept coming alive because of this.

bluetidepro2• 9 years ago

This would be neat if you could build a wrapper of this around GitHub pages. Then you could finally use GitHub pages sites for private content!

Also, as a non-security person, just how secure is this? Like is it used more for "eh, I don't really want something to see this, but it's not the end of the world if they do" or more like "yeah, use this for extremely secure content, it's safe."

sleepychu3• 9 years ago

In part it depends on the strength (and secure transmission of your passphrase (though if you have a good way of transmitting the passphrase this becomes less useful))

The encryption itself is solid (assuming it is implemented correctly and as described, I've not inspected the code) but as mentioned a short pass phrase combined with predictable plain text format would make this quite easy to brute force.

falcolas2• 9 years ago

The pass phrase also can't be changed, without reencryping the entire page. Once leaked, the contents are effectively publicly available.

Also, you can't revoke access (again, without site-wide re-encryption).

An interesting POC, but not something that is really practical for broader use.

dangom• 9 years ago

Doesn't the GitHub pages content itself live in a repository visible to all? One could just look up the password. Or is it possible to have pages for private repos as well?

Darphe• 9 years ago

The passphrase wouldn't be included in the repo; that's the purpose of using client-side encryption.

bluetidepro2• 9 years ago

What Darphe said in their reply. But yeah, you can setup pages for private repos. That's mainly what I was thinking. I currently do that for a few projects. You can have a private repo and still use github-pages, it just obviously exposes the pages to the public technically (but not the repo code).

nico_h• 9 years ago

Not an encryption expert, and would likely use it myself.

My guess is it's about as secure as putting an encrypted file on the internet. Except this has almost all the information you need to know how it was encrypted. Plus it has a useful guess-the-password form. There is no attempt-limiting or rate-limiting if you can download the file.

codazoda• 9 years ago

I'm no expert but I think if they use a cryptographic function that requires a lot of CPU cycles, such as bcrypt, it will still be hard to brute force as long as you use a secure password. It looks, however, like they might have used something like sha256. I don't think that requires a lot of CPU and so it's much easier to brute forced.

It's probably good enough for stuff like an informational product that you want to put behind a password but not good enough for storing your credit card details.

olkid• 9 years ago

short answer: no, it's not secure

longer answer: look at the last script tag in the demo page, it exposes the encrypted HMAC string, the encrypted HTML text, the encryption method and even the library used to decrypt. You can easily brute force the passphrase

...or better yet embed some code in a popular web page and have the netizens brute force it for you (distributed computing).

In general, client side obfuscation is difficult to perform securely as it shares too much information to be secure.

sleepychu3• 9 years ago

Rubber hose encryption would be a neat add here!

zyx3213• 9 years ago

Do you mean plausible deniability? That would be hard to accomplish on a static file, since there's no logical reason it would include 'empty space' in the way an encrypted hard disk does.

ColanR3• 9 years ago

I don't think so. There was an encryption scheme thought up and partially implemented about a decade (or two?) ago that allowed for an arbitrary number of partitions to exist in a single encrypted drive. It was called 'rubber hose' because the scheme was designed such that it was impossible to determine how many partitions existed inside the encrypted drive.

I don't think it's a scheme that's even relevant to this context, though.

Edit: source. https://en.wikipedia.org/wiki/Rubberhose_(file_system)

roywiggins3• 9 years ago

In highschool I realized that my school's grading system was using a javascript scheme to control access to grades online:

1. Concatenate the username and password, hash the combination

2. Name the HTML file with the grades using that hash

3. When the user logs in, calculate the hash in Javascript and redirect to that HTML page.

In theory, you can only work out the URL of the page if you have the username and password in hand. I'm sure it was pretty trivially bruteforcable, but aside from that it seemed sort of okay.

Until I realized that directory listings were turned on, and the directory that had all the HTML files sometimes had no index.html, thereby rendering the entire obfuscation scheme moot.

(n.b. I was too ethical to use this to peek at anyone's grades! I did try to report it but it was never clear to whom to report it to, and since every teacher generated these files using their own copy of the program, there was no obvious central place to report this to. A couple of years later online grades were centralized into a different system)

kinkrtyavimoodh• 9 years ago

1. Concatenate the username and password, hash the combination

So if you change your password, you cannot access your grades? How is this okay?

_ZeD_• 9 years ago

Change your password? how silly :D

SomeStupidPoint2• 9 years ago

The system accepting your password change updates the HTML file would be my guess.

roywiggins3• 9 years ago

You just can't change your password. If you want to change it, you go tell your teacher your new password, and then when they update grades, that's the password that will work.

Of course, each set of grades is managed by each teacher individually, so you would have to individually update your password on each "system"...

haywirez• 9 years ago

Did something similar once, then a friend of mine found out the password within 5 minutes using a simple google rainbow table search. So make sure to at least salt it :)

mmcnl• 9 years ago

And always perform hash verification or decrypting client-side so you can prevent brute-force attacks (purposely slowing down the hash verification or decrypting to 100ms is okayish already).

joekrill• 9 years ago

From the way we've seen most schools respond to these types of reports from students you have to wonder if you were lucky that you couldn't figure out how to report it!

ythn• 9 years ago

"zero tolerance"

mintplant• 9 years ago

Definitely. My high school's school district made a similar mistake with enabling directory listings, enumerating hundreds of documents with words like "Confidential" and "Audit Report" in the file names. Tried to report it at the time but I got the runaround from the school office; years later I'm glad I didn't manage to get any further with it.

Natsu• 9 years ago

When I found a way to bypass the login process back in university and thereby gain access to the previous users' network storage in university, I reported it anonymously for that very reason.

roywiggins3• 9 years ago

The time I accidentally took down the entire school website, I luckily did it at school and immediately told my understanding math teacher, who told IT directly, who came and asked me what I'd done, and fixed it within a couple minutes.

In retrospect I dodged a huge bullet!

SomeStupidPoint2• 9 years ago

Circa 2005, we got hired by the district for finding problems.

Of course, we either found them during tech class (pre-req for A+ class) or after we'd asked the school tech for permission to explore (and been told it was okay as long as we documented what we learned/didn't do obviously malicious things).

I think the worst I saw was a kid get suspended for a week then kicked off the network for the rest of the year. He got caught with a ton of warez, pirated stuff, etc on his share when we got investigated by the district for accidentally taking down the network because someone left Guild Wars auto-patching on.

Good times.

cyberferret4• 9 years ago

My first year of computer science, I was bored in the labs one day working on a basic Pascal programming assignment. Back then, our university had a VAX mainframe system that everyone worked on (staff and students alike).

I logged off my account, and then just for the fun of it, decided to log back in using my course unit (INF180) as the username and password.

Lo and behold, It let me in. As the course administrator. I could see student records and past assignment gradings for everyone else on my course.

Looking at the folders, it seemed that future assignments etc. were also stored within that account. I didn't go any further. I simply logged out and stayed quiet (and uneasy) about the whole thing. I was too scared to report it in case I was thrown off the course for 'hacking' the system.

A few years later (after I had well completed my studies), I was helping a friend in the same labs with an assignment. I wondered if they still had the same flaw, so I found a spare workstation and tried the same trick, but it wouldn't let me in. Glad they fixed that loophole.

stcredzero3• 9 years ago

decided to log back in using my course unit (INF180) as the username and password...I didn't go any further. I simply logged out and stayed quiet (and uneasy) about the whole thing. I was too scared to report it in case I was thrown off the course for 'hacking' the system.

Since when have this country's schools been run by idiots? Not you, but the people who would have let such an idiotic situation come about and on top of it, have created a climate where one would fear repercussions for reporting on it? Since when has this country become run by uncomprehending idiot authoritarians? When did this come about!? AFAIK, High schools and colleges weren't like this in the 80's.

feelix• 9 years ago

Why didn't you report it anonymously then?

paulddraper• 9 years ago

I had a CS professor that had his own custom grade site written in Racket.

You could see other people's grades by knowing their username.

I emailed the professor. He thought I was being insolent.

For all I know the system is still like that.

---

My favorite though was the queuing system to pass off CS lab assignments. A bit of XSS, and your name made its way to the top.

jacquesm• 9 years ago

I hope at least they discouraged crawling of the pages using robots.txt otherwise a directory listing would index all the sub-pages. If you're really unlucky they might even end up in web.archive.org.

cycomachead• 9 years ago

Not that I recommend this, but if you want a (US) school to fix a grading security issue, you threaten to sue because exposing grades is a FERPA violation and schools could lose funding.

3131s• 9 years ago

I was able to enter my high school's student information and grading system without any kind of authentication. I didn't really know much about computers at the time, so I was just looking through the applications installed on one of the nicer media lab computers and found the access portal. I didn't change anything though, but only because the lab teacher seemed suspicious already.

viggity• 9 years ago

I remember very distinctly about 15 years ago there was a site that had a "members only" page that had some reports that I really wanted (names/addresses/emails of the members of the org - I wanted a quick and easy lead list for a product I wanted to sell to them). I could see through a simple view source (remember, no chrome dev tools back then) that it wasn't some server side check of the password (the members knew it, there was no associated username).

They had found some library that would take a password and a desired output and would generate some super crazy javascript looping/shifting/replacement algorithm that would generate the name of the html page that had the desired content. The report was available openly to the internet, but there were no links to it, just through this algorithm.

I spent about 4-5 hours slowly but surely reverse engineering the algorithm so I could figure out what the page name was. There was an immense sense of satisfaction that came with being able to look at those reports.

pbhjpbhj• 9 years ago

Unauthorised access and for financial gain - serious prison time awaits for such things in USA and UK. Take care!

tspike• 9 years ago

Interesting. What is the use case for this versus HTTP basic auth?

artursapek• 9 years ago

It's self-contained so you can serve/share it statically. HTTP basic auth requires a server backend configured with the credentials.

apetresc• 9 years ago

A lot of static hosting methods don't make it easy to implement HTTP basic auth. The beauty of this approach is it's completely transparent to the network/application layer. You can use this with just some files on S3 or GitHub Pages, for example.

merkaloid• 9 years ago

https://news.ycombinator.com/item?id=14554187

simlevesque• 9 years ago

A static website on S3.

jewbacca• 9 years ago

You don't need to control the server

But you can still control access to the content, distributing the password by other channels.

A plausible use case for this (... like basically any crypto thing) would be clandestine organizing. Significantly less sophistication required, and much less of a trail left, to put a static site online.

Shit, you wouldn't even need to host it as a site: you could drop it somewhere as text, eg on a pastebin or in a forum comment, with "save as .html and open" instructions. And you could distribute the encryptor itself the same way.

The really great thing about this is that you could do practical human crypto, without Alice or Bob needing any special knowledge or equipment besides a web browser, using arbitrary uncontrolled public infrastructure.

... though if someone knows the password + controls the infrastructure you've used, they could substitute their own content.

... also short password + direct access to ciphertext -> easy brute force.

... also everything here: https://news.ycombinator.com/item?id=14554187

Wouldn't use it for anything state-level or life-or death. There are mitigations, but that would increase the difficulty and necessary sophistication for using it. Actually, this probably falls into the uncanny valley where it seems just accessibly cyberpunk enough to be extremely dangerous to anyone relying on it. But still, really cool IMO.

snakeanus3• 9 years ago

HTTP basic auth does not provide encryption.

StavrosK• 9 years ago

Oooh, this is pretty cool. All that it needs is a cli utility so I can plug it in my scripts, and I can just tell my static site generator to encrypt specific pages while building.

perryprog2• 9 years ago

That would be cool! Maybe a gulp plugin or somthing, that would wrap your pages with that, and then set a cookie or something.....

fredsted• 9 years ago

Encrypted page includes javascript from 2 CDNs, one for jQuery and one for "crypto-js". The jQuery one has an integrity hash, but "crypto-js" does not. Granted, they both use HTTPS...

Doesn't seem very secure to include external JS on an encrypted page.

Why not include those things inline?

And why does it need jQuery for a simple 1-input form field that decrypts a string?!

acdha2• 9 years ago

Using a CDN is only a problem if it's compromised, which is unlikely to be a threat for most applications. You can avoid this entirely by using Subresource Integrity:

https://developer.mozilla.org/en-US/docs/Web/Security/Subres...

It looks like the developer for this page copied the CDNJS links at some point but didn't do so consistently and later commented out the SRI portion of the jQuery tag:

    <!--integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="-->

yoble6• 9 years ago

Oops thanks, that should be fixed - the generating page now gets its libraries from CDNs.

I'll probably look into adding Subressource Integrity checks for the other two as well.

joshu• 9 years ago

It is also a threat if your DNS is compromised.

pc862• 9 years ago

Stack Overflow is riddled with questions from people asking how to do incredibly basic things "in jQuery."

wlesieutre• 9 years ago

I think this one is satire, but you never know ;) http://i.imgur.com/Q3mkcnl.gif

enobrev• 9 years ago

My highest rated answer on Stack overflow, by an enormous margin, is a simple jquery question (How to get the value of a textarea).

johnhenry2• 9 years ago

I don't mean this to sound sarcastic, but you seem to be knowledgable enough to make a pull request to the open source project?

[Edit: looks like this may already be on the way to addressing your issue https://github.com/robinmoisson/staticrypt/issues/1]

onion2k• 9 years ago

Embedding the crypt.js library in the resulting page would essentially pin the page to the version that was current at the time the HTML was encrypted. That could be problematic if there's a bug in the library.

yoble6• 9 years ago

I like the idea of the page relying as little as possible on my code (you have a better chance to trust a well known public CDN on HTTPS than some minified code inlined from an unknow github repo).

But I understand your point, plus it would be nice to have a page working completely offline. Will add the option to embed the needed library in the single file.

It definitely does not need jQuery :) The page was a POC, since it seems it might be useful to some I'll clean it up. Thanks for the feedback !

sodafountan2• 9 years ago

While it's true that jQuery is unnecessary, why does it matter? For one this is just a simple example to show off something cool that's possible that many people wouldn't initially think would be, I highly doubt that this is meant to be used seriously but more importantly it re-writes the entire page once the passphrase is found which overrides the jquery dependency and all other dependencies.

Why do people like to complain so much?

Gaelan• 9 years ago

jQuery stays in the JS namespace even after its <script> is gone.

conmarap• 9 years ago

It's pretty cool. I entertain the idea of doing this and hadn't thought of it ever, but how do you see it being used if I can't use it with a python/node.js API to deploy pages on the fly?

johnhenry2• 9 years ago

Reminds me of this: https://news.ycombinator.com/item?id=10901745

Similar, but uses files instead of HTML text.

romanovcode• 9 years ago

For some reason it doesn't work with password 123

yoble6• 9 years ago

The password "123" is working for me, if you find steps to reproduce do let me know !

jszymborski• 9 years ago

I remember in ~2005-2009 while I was in high school, javascript password-protection was my main interest, since I only had access to free hosts that hosted static files.

Most of them just focused on obfuscating the password in the source (most by encoding, the fancy ones through some opaque evals), but I came across one during that time that claimed to use AES and even had a not-insignificant cash prize for defeating it.

I really wish I could find that site... would be fun to give a shot at cracking it given what I know now.

Anywho, in my search for that site, I found a pretty good tutorial considering it's age (1997!) on implementing DES in javascript to achieve something similar[0].

[0] https://www.javacrypt.com/Course/

calebm• 9 years ago

I wrote a little web app very similar to this last year: https://hypervault.github.io/. The difference is mine was mostly focused on file encryption.

perryprog2• 9 years ago

That is cool :D

examancer3• 9 years ago

Simple and useful. The perfect "Show HN".

nroets• 9 years ago

There are many caveats. For example, the server and the connection must be trusted. Otherwise, an attacker can the javascript to send himself a copy of your password.

And weak password are subject to bruteforcing.

If you trust the server, rather use htaccess. Or place the document at example.com/mySecretPassword/index.html Just be careful about outgoing links.

snakeanus3• 9 years ago

From the source code I was unable to deduce what KDF and Block mode is used with it. Does anybody know what does it use? crypto-js seems to support multiple different KDFs and Block modes.

cryptoishard2• 9 years ago

doc says it defaults to cbc, not sure about the kdf

syphilis2• 9 years ago

It does not seem to work for me on multiple machines. I just get an incomplete HTML file that ends abruptly after the "border-top" CSS line. There is no closing semicolon to the line, the file just ends in the middle of the style element.

My input doesn't seem to matter, but I used:

<html><body>Hello</body></html>

Password: abcdefg

chicob3• 9 years ago

Same here.

<head> is truncated.

torrey_braman• 9 years ago

Retry it without the html tags

zokier• 9 years ago

Welcome to the brave new world of web, "Optimized for IE5.5+" making a beautiful reincarnation with pages that only work with Chrome and silently fails on Firefox.

mlok2• 9 years ago

Same here

yoble6• 9 years ago

Thanks for the heads up - I'm reproducing it on firefox, I'll investigate asap.

alexbecker• 9 years ago

I did something similar to this for redacting HTML pages a while back, although I never fully polished it: https://github.com/alexbecker/redact-js

It's not something I'd use for serious security applications, but fun for interactive fiction.

shams93• 9 years ago

Back in the day we used to use Apache basic authentication for this, that was before single page apps. Not you do have jwt that is explicitly designed to handle things like offline progressive web app logins.

xaedes• 9 years ago

As I read the title my first thought was "Huh? htaccess?"

nealrs• 9 years ago

Pretty pretty neat. I built [something pretty similar](https://devpost.com/software/cryptopostal) to give my address to family & friends during the holidays. Includes a node generator to make your own. Enjoy :)

[video demo](https://youtu.be/zevMEiR2CZY)

skdotdan• 9 years ago

Seems very cool, but I don't see the use-case. Anyone can help me?

akeck• 9 years ago

Static site on CloudFront?

jopsen• 9 years ago

That's a fun toy.. and a great example of how easy it is to get crypto wrong. I'm just guessing here, but you are probably missing some key derivation like PBKDF2.

Edit: For this something like tweetnacl is probably more foolproof, checkout: https://github.com/dchest/tweetnacl-js

Or libsodium which can also be compiled to pure js: https://github.com/jedisct1/libsodium.js

lwhsiao• 9 years ago

crypto-js has PBKDF2 functionality. What part of it this did you find wrong? Preferably not a guess, but something more concrete that can be informative for other readers. For example, could you provide some insight on why the two libraries that you link to better for this use case?

cryptoishard2• 9 years ago

You've somewhat rolled your own crypto. For instance, you've manually HMACed separately and appended it to the message, and you've chosen which encryption primitives to use. In this case, I don't see anything wrong (you've used encrypt-then-mac, which is the recommended way of doing it).

Another easy to make error would've been to use the same key for the MAC and the encryption. In this case, the library probably uses a unique salt everytime it generate a key from the passphrase, so you're fine there too.

In principle though, using a library like NaCL or Libsodium offers a high level "encrypt and sign" primitive and you should be using something like that to avoid getting anything wrong. There are lots of mistakes to be made.

libsodium is unfortunately a bit broken because the pw_hash functions (argon + scrypt) don't work in the browser.

shawnz• 9 years ago

I'm just guessing here, but you are probably missing some key derivation like PBKDF2

How could you use AES with a passphrase with no key derivation function?

Animats• 9 years ago

There's basic authentication for protecting static web pages. It's no better or worse than any other password scheme.

Steeeve• 9 years ago

That is awesome!

I would love to see it worked out in a way that it would output different content depending on password.

amenghra• 9 years ago

In 2017, one ought to use browsers' native crypto API instead of doing crypto in js...

colejohnson66• 9 years ago

Browsers have a native crypto API? Last I heard, websites requiring client side crypto used libraries written by other people. There's even a Node.js module for crypto.[0]

[0] https://www.npmjs.com/package/crypto-js

kaoD• 9 years ago

https://www.google.com/search?q=web+crypto+api

petethomas• 9 years ago

Just fyi on the native front our team recently started work on npm package webcrypto-crypt in conjunction with some experiments utilizing IPFS hypermedia and modern web browsers. Maybe others will find it useful: https://www.npmjs.com/package/webcrypto-crypt

chiefalchemist• 9 years ago

Not sure, but this might be useful and/or interesting to some HN'ers

https://github.com/ezWebDevTools/ezCryptoJS

bandrami• 9 years ago

If only the web server software could do this for you...

thesmok• 9 years ago

It should be quite easy to make an nginx plugin for that.

112233• 9 years ago

A feeling of saying "what is this familiar thing":

http://www.acme.com/software/securepage/

(2010 or earlier, basically does similar trick, from the authors of thttpd, mini_httpd and micro_httpd!)

yoble6• 9 years ago

I didn't find that one when I looked for this kind of tool so I rolled out my own, I would have definitely given it a go !

speps• 9 years ago

And no one mentions TiddlyWiki[0]...

[0] http://tiddlywiki.com/

minhajuddin• 9 years ago

I had built something along these lines. Not really encrypting the page. But allowing you to send each other Base64 data: http://cloak.websrvr.in/ . I had built it to circumvent enterprise email servers which don't allow sending binaries. Which is kind of ironic because email sends attachments as Base64.

anilgulecha• 9 years ago

This is cool! To really make the overhead tiny, include an inplace implementation of XTEA (under 1KB decryption).

XTEA is not a military grade algo (but there's only been a partial attack on reduced rounds). All in all the overhead can come in under 2KB in all.

ConfucianNardin• 9 years ago

This is essentially what encrypted pastebins do (but they usually put the key/password in the URL hash).

renhoeknl• 9 years ago

I did something like this some time ago, to send reports securely to people who'd never heard of PGP.

What I like about my implementation is that it has a tamper proof clear text message included with the encrypted payload. And everything (images and JS) is inline, so nothing external needed.

http://ivo.palli.nl/encryption/encryption2.html

finchisko• 9 years ago

Thank you for inspiration. I've created nodejs module to encrypt files. Now wondering if we can make webpack bundle-loader that will load encrypted chunks. How cool would be that? What u guys think?

Show HN: Password-protect a static HTML page

Related Stories