-1

I need to create an HTML page that will generate a list of hyperlinks to the contents of the client side directory in which it resides.

This would allow HTTP browsing of a local NAS, where no web server involved and contents can change dynamically.

This might be extremely useful to anyone serving content on a LAN. We need this feature in an educational setting, where directory contents will change frequently. Making manual links would be prohibitive, and file browser access is also needed.

Our Digital Media program will be much obliged to anyone who can help us with a solution.

gapmedia
  • 11
  • 1
  • 4
    Problem here is clientside JavaScript has no clue what is in its directory.... – epascarello Sep 19 '18 at 14:54
  • 1
    This cannot be done in-browser, you will need a solution built in something like node js. – somethinghere Sep 19 '18 at 15:05
  • The script at this link comes close to providing a solution. https://www.javascripture.com/FileList If the 'input' could be pointed to the current directory, this code supplies the names. Names are all that's needed, since _files will be in the same directory_. – gapmedia Sep 19 '18 at 22:58

1 Answers1

0

Without any kind of server/back-end code, an in-browser NAS file explorer is not possible. Client-side JavaScript only interacts with the client. It's possible for client-side JavaScript to contact a server, however, and retrieve information about that server's directory structure, but, of course, that would require a server where you say you can't have one.

Adam
  • 3,829
  • 1
  • 21
  • 31
  • Actually there are a number of ways JavaScript can access local client side files. I've found lots of examples in researching this problem. Here are some examples: - https://www.javascripture.com/FileList - https://www.html5rocks.com/en/tutorials/file/dndfiles/ - https://developer.mozilla.org/en-US/docs/Web/API/FileList – gapmedia Sep 19 '18 at 16:56
  • Correct by saying local I mean as in LAN. However, the behavior on a network drive will be identical to a directory on your desktop. – gapmedia Sep 19 '18 at 17:05
  • All the links you provided cover the File API, which allows users to upload and process files. This is completely different from being able to programmatically traverse and inspect the remote directory structure. – Adam Sep 19 '18 at 18:22
  • I see what you're trying to achieve, but the File API isn't for that. It's for uploading local files and processing them. To do that for an entire NAS, you would have to upload _the entire drive's contents_. Even then, you can't get directory structure information from it. – Adam Sep 19 '18 at 18:57
  • Yes, I realize this is well beyond what the File API is designed for, but it seems like it might provide the tools. The first [example (above)](https://www.javascripture.com/FileList) goes part way there. It seems like combining the functionality of the two scripts on that page could be pretty close to the answer. https://www.javascripture.com/FileList – gapmedia Sep 19 '18 at 22:38
  • If an could be passed the files in the current directory, this code supplies the names. Paths aren't needed (just file names). Files will be in the same directory, so URLs will just be names. Thanks again for your thoughts on this [Adam](https://stackoverflow.com/users/4881192/adam). Do you think that could be a possible solution? – gapmedia Sep 19 '18 at 22:39
  • It sounds like we're talking about two slightly different ideas, but I'm not sure I understand what you're going for. As far as I know, creating a web-based file browser for a NAS isn't possible without a backend. – Adam Sep 19 '18 at 23:51
  • @Adam It was not possible until recently. Some browsers are able to read and modify directories using the [File System Access API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API). – Anderson Green Feb 20 '22 at 18:40