Static web server autoindex listing using NodeJS

Sabtu, 18 November 2023, 10:40 pm48

In PHP world, webserver with autoindex module (e.g Apache mod_autoindex, Litespeed Auto Index, nginx ngx_http_autoindex_module) already provide a way to display file listing in a public directory – we don’t even need PHP to have this feature.

414DAA4A-01EB-4EB3-AF57-D00421D7C850.jpeg
Example directory listing at chromedriver website.

In NodeJS however, since it is a more general purpose language, NodeJS itself functions as a webserver, with its http module (built-in, low level API), or by using express module (web app framework).

One of express middleware, named serve-index, provides this functionality to display file listing of a public directory.

To demonstrate how this work, follow this tutorial:

mkdir static_server
cd static_server
npm init -y
npm install -y express serve-index
mkdir public
touch public/test.txt
echo "helo wolf" > public/test.txt
touch index.js

Use this source code for index.js:

Now you can run the app:

node index.js

Check the result in web browser, http://localhost:8080

F99A38D9-637E-49A0-A6AD-059801CEC102.jpeg
This is the layout provided by serve-static with options to show file icons, show hidden files & use details display type.

When clicking on the file link, you can see the content in browser if supported. If it’s playable audio or video, then the browser will play it. Or else will prompt to download it, similar behavior of common static webservers.

A0B1D28A-C53C-4F2C-ADD6-F3F55052D0A6.jpeg
If you notice on the top right corner, it also got search function. However it searches the current directory only.

ShareTweetSaveSendCopy