Hacker News new | ask | show | jobs
Show HN: Running a simple local HTTP server in a web page (github.com)
75 points by etherdream 1695 days ago
6 comments

For those who don’t understand what it’s doing (like me at first):

You first have to host these index.html and sw.js on a regular server (or use the URL in the readme) and then this service will serve a folder of your choice directly from your computer.

This is if you ran your trusty Python server from the CLI, except you did it from the browser, with an unchangeable host:port

The folder will appear to be published from the server that hosts that sw.js file.

> You first have to host these index.html and sw.js on a regular server

I guess no server worker from a file://-url?

Chrome tells me "Failed to register a ServiceWorker: The URL protocol of the current origin ('null') is not supported." when I try it.
I may be missing the point, but HTTP is a communication protocol. This looks like a file explorer and editor.
It is using HTTP, just doing it through browser APIs[0][1] so in this case the server layer is the service worker but it's still happening through HTTP means. So the client and the server are both running in the browser, the only difference is that this "virtual" server can only be accessed by the same browser session. They are very powerful APIs as you can intercept the network layer and do all sorts of hacks, like the OP's project.

[0]: https://developer.mozilla.org/en-US/docs/Web/API/Response

[1]: https://developer.mozilla.org/en-US/docs/Web/API/Service_Wor...

Not the same. Disk files can be browsed via HTTP (HTTPS), so you can preview a local static site directly, without tools such as http-server, SimpleHTTPServer, etc.
Service worker file loader != HTTP server. You are intercepting requests which are usually fulfilled by HTTP, but you are not implementing or interacting with HTTP.

Even so, cool project.

If the files are served via HTTP I am missing it. A page which is fetched via HTTP and then accesses local files is not an HTTP server.

https://en.m.wikipedia.org/wiki/Hypertext_Transfer_Protocol

Genius! I feel the File System Access API[0] has a lot of potential in bringing data ownership back to the users (instead of being held by some server) but it's very under-utilized atm.

Nice work.

[0]: https://developer.mozilla.org/en-US/docs/Web/API/File_System...

From the title, I thought it would be a web server compiled as web assembly and running in the browser...
You are right. I am planning to add PHP, similar to wasmer-php[0], but based on Service Worker.

[0]: https://github.com/wasmerio/wasmer-php

sry, not wasmer-php, but php-in-browser

https://oraoto.github.io/pib/

This is interesting. It’d be cool to drop in a wysiwyg editor. Could be a fun way to learn basic web dev
You can use vscode's web editor [0] which allows you to open local folders and even run full LSPs for JavaScript, TypeScript and Python

[0]: vscode.dev

Like....Microsoft Frontpage split view?
Where is the source code for the .webm file?
You mean the .mp4 in the README? It seems like it's just a plain link inside the README.md that GitHub previews/displays. Didn't know it did that. The link is:

https://user-images.githubusercontent.com/1072787/138898490-...