setup doesn't work reliably & no CSS

[Sammeeey]

I'm trying to encrypt a very basic HTML file using staticrypt filename.html.
It once worked.
After I deleted the generated .staticrypt.json and the /encrypted the password protection doesn't show up anymore by default (using the VSCode Live Server Extension).
Even if I do the same in a different basic project.

When I open the index.html in the /encrypted folder, the password protection screen shows up and I can access the site using the password. But it doesn't find the linked images or any CSS:

My setup

StatiCrypt version: 3.3.1
Node version: v18.16.0
Any additional relevant context, if any: Win 10

[robinmoisson]

Hey @Sammeeey, sorry for the late reply and thanks for reporting.

Regarding not finding linked CSS or images: what staticrypt does is encrypt the html file only, and put it in the /encrypted folder. So if your file structure is

encrypted/filename.html
filename.html
style.css
image.jpg

and your original html file links to external files with <style src="style.css">/<img src="image.jpg">, then since the encrypted file is in encrypted/ when you decrypt it it won't find the other files. (it'll look under encrypted/style.css and they're not there)

You can either move the style.css and image.jpg in the encrypted folder, use absolute links to the files (src="/style.css" or src="//mywebsite.com/style.css"), change your structure to have something like

encrypted/filename.html
html/filename.html
assets/style.css
assets/image.jpg

and have relative linking with src="../style.css"... Many different options depending on your setup.

Regarding encryption working once: I don't think I understand exactly what you did here. Why did you delete the .staticrypt.json file, and especially the encrypted/ folder? That folder is where the encrypted file will be.

[jshph]

Hi, I believe I have a similar issue and can offer some more perspective: if I pass a directory to staticrypt, and there are css files in that directory, staticrypt will attempt to encrypt the css files (or any other file) as an HTML file. This causes syntax issues in the resulting css file.

I would prefer if the CSS file were just copied to the new directory (this would work for my use case). Not sure if this is the general case solution though.

Additionally, if there are multiple index.html files that are being passed, they seem to copy to the same file without preserving the original directory structure.

[robinmoisson]

Hey @jshph, thanks for commenting and for the good idea.

I think if we pass a directory we could encrypt the .html files et copy everything else as is in the new directory, instead of trying to encrypt other files in a way that doesn't make sense. Seems like this would solve your use case?

That means we're suddenly including files that used to be encrypted as plaintext, but I guess that's not behavior you were supposed to rely on (since the files were unusable), so not a breaking change. I'll sleep on it, happy to hear if others think otherwise.

---

Regarding the multiple index.html files, can you give more details? If you pass staticrypt foo/index.html foo/bar/index.html that's to be expected, when passing single files staticrypt will get the file, encrypt it and put it at the root of the encrypted directory, so if they have the same name they'll overwrite each other. If you want to preserve a directory structure, you'll have to pass the directory itself as an argument, with the `-r| flag.

[jshph]

Yes that's exactly it. I consider the ability to pass a full directory as an improvement, but for my use case it needs to only encrypt HTML files. Perhaps others' use cases differ; an "excludes" filter that takes glob arguments could help.

I think I wasn't aware of the -r flag helping to avoid overwriting index.html! I ended up reverting to an earlier version of staticrypt that relies on find... exec for now.

[robinmoisson]

Done & published! Starting 3.3.2, non-HTML file will be copied as-is.