DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Calin Baenen
Calin Baenen

Posted on

[RANT] Why the hell does everything cool in JavaScript have to be locked behind needing server?

I wanted to do some messing around with sharing data between HTML files, and the only effective way to do that is by using search parameters which isn't exactly always ideal.

You can't store cookies in file://. (You can, but it doesn't work on any forks of Chromium, the most common/popular kind of browsers, without setting a flag from the terminal.)

You can't even use localStorage either.
Why not? Because it only works on a per-domain basis and Chrome treats each file as its own domain. 😩

Not only is there this downside of not being able to share data across pages, you can't even read local files relative to the folder the HTML file is in, you need a server for that.

I'm so fucking frustrated that a lot of the more useful/complex features of JS require a "server" of some kind. It makes no damn sense.

Top comments (27)

Collapse
natescode profile image
Nathan Hedglin
  1. Install the Live Server extension in VS code to serve your HTML file correctly. Right click on the HTML file and use live server preview.

You can also do npm -g serve and then call serve . in your project directory to serve the HTML file from a JavaScript web server.

  1. Browsers are designed to render files FROM servers. So you'll want to understand the client server model to get farther in web development. Yes, all the cool stuff is backend πŸ˜‰ imho.

Hope that helps. We've all been there.

Collapse
baenencalin profile image
Calin Baenen Author

Browsers are designed to render files FROM servers. So you'll want to understand the client server model to get farther in web development.

Well the thing is that I just want to use this for some local pages to redistribute, not everyone is going to know (or want to learn) how to set up a local server just to run some stupid files a dipshit child made.

Collapse
natescode profile image
Nathan Hedglin

You could host the files free on github pages to share.

Thread Thread
baenencalin profile image
Calin Baenen Author

I guess this idea would work.
The only reason I opt for local .html files is because you don't need an internet connection to access them.

Thread Thread
natescode profile image
Nathan Hedglin

so how are you trying to share them? via USB or a shared computer?

Thread Thread
baenencalin profile image
Calin Baenen Author

Via the internet.
But once you download the files, I don't want it to be a requirement you have internet after that point.

Imagine I'm making a game, if your internet suddenly goes out you can't (keep) play(ing) my game.
But if you downloaded the files before the outage and have them ready to go: you can.

Thread Thread
natescode profile image
Nathan Hedglin

Ah! You want a PWA or progressive web app with offline support. That's doable !

MDN is your best friend

developer.mozilla.org/en-US/docs/W...

Thread Thread
baenencalin profile image
Calin Baenen Author

Þanks for ðe suggestion, I'll check it out.

Collapse
smitterhane profile image
Smitter hane

Simplify your day by just running npx serve at the root of your project

Collapse
smitterhane profile image
Smitter hane

NPX is a commandline tool available from npm@5.2.* , i.e from npm version 5.2.* and above. It allows to execute commands from the npm global registry without having to install them.
NPX will allow you to serve your project but it will need to install the package: serve if it in not already installed and store it in the cache.

Collapse
baenencalin profile image
Calin Baenen Author

How does it serve Γ°e page?
What does Γ°at do? Just make it available ΓΎeough localhost or someΓΎing?

Thread Thread
smitterhane profile image
Smitter hane

Yes you are right. Through localhost. And you can then interact with your web page

Collapse
baenencalin profile image
Calin Baenen Author

What does that do and how do I use it?
And what is npx?

Collapse
ecyrbe profile image
ecyrbe • Edited on

So you should change your title. This has nothing to do with JavaScript.
Because you can obviously run JavaScript with node, deno, bun without any server.
You are talking about Browsers. And i have news for you... Browsers where meant to access the web.
You can use other technologies than Browsers to render HTML, use storage...there is electron, tauri, etc to not use a server with a domain name.

Collapse
baenencalin profile image
Calin Baenen Author

This has nothing to do with JavaScript.
Because you can obviously run JavaScript with node, deno, bun without any server.

It does. It literally makes reference to document.cookie and other JS mechanics.

You can use other technologies than Browsers to render HTML,

Yes, but this is most convenient.
I don't wanna just randomly go into some language, work with some janky markup parser, then have to compile the program for different systems when I could delegate that to the browser.

I would also like HTML and JS functionality so it's more convenient (and makes more sense to me) to do this in the browser.

use storage

I already stated why I can't use localStorage, unless there's something else you're referring to I don't know about.

Collapse
ecyrbe profile image
ecyrbe

Let me rephrase this. I don't mean to be rude. No harm ahead.

First, Javascript is not tied to web browser technology. Like i said, Javascript can be used outside of browsers :

Now regarding document.cookie. It's specifially tied to web. It's not a browser technology, It's a web technology tied to HTTP protocol .
Cookies are fondamentally tied to remote servers. It's not your browser fault if is preventing you from using it on a file. it makes no sense to have cookies on files (imagine, this would mean having tied cookies for each file you browse on the web). No cookies are tied to a remote domain. It's their definition.

Now regarding localstorage. It's the same reason, localStorage by design are tied to a domain, not a file. Again, tying it to a file would make it useless for the web.

Now regarding doing cool things on browser without a server to share something between pages... i have your back.
Go here, this is called WebRTC. One cool thing with this. You don't need a web server. You can make two HTML files communicate with javascript.

Now have fun.

Thread Thread
baenencalin profile image
Calin Baenen Author

Let me rephrase this. I don't mean to be rude. No harm ahead.

I didn't think you intended to originally.

Thread Thread
baenencalin profile image
Calin Baenen Author

Can WebRTC hold data even when the browser is closed?
That's part of the functionality I was after when trying to see if I could use cookies or localStorage.

Thread Thread
ecyrbe profile image
ecyrbe

Unfortunately, no. There is no storage you can use on a browser without attaching it to a domain and then to a server.
The only thing you can do, is having a local html file that interact with a third party service that will store it for you, like aws dynamoDB. But if you really want your page to not need internet access, i'm affraid you can't.

Thread Thread
baenencalin profile image
Calin Baenen Author

Thanks for your help.

But as a subrant, that's stupid.
There should be like directoryStorage, which is like localStorage for the CWD of the HTML file.

Thread Thread
baenencalin profile image
Calin Baenen Author

I just ΓΎought:
Could I do some Stop'N'Swap shit to store data? Basically open a new tab, sync local-storages, close first tab to simulate data transfer?
Or is Γ°at no good?

Collapse
foxy4096 profile image
Aditya Priyadarshi • Edited on

I just typically use python http server

python3 -m http.server

It will server the directory contents on localhost:8000

Collapse
baenencalin profile image
Calin Baenen Author

While this is a simple solution that can work for me.
Not everyone has Python installed nor wants to invest the time.

I guess it's my fault for saying I was doing testing ("I wanted to do some messing around").
But I was thinking for HTML files that could then be redistributed and run on other people's machines.

Collapse
besworks profile image
Besworks

You could use Cloudflare Workers to host your files for free. As with many other Web APIs, service workers are tied to a domain. When a user visits your page, your worker is installed in the browser and and acts as a kind of proxy. Future requests are then served directly from cache enabling offline access.

Thread Thread
baenencalin profile image
Calin Baenen Author

Huh. Neat.

Collapse
ben profile image
Ben Halpern

What is the "Why" anyway?

Collapse
baenencalin profile image
Calin Baenen Author

What do you mean, exactly?

πŸ€” Did you know?

Β 
✍️ Writing your own article is easy (we even support markdown)