List directory contents with Apache - apache

Question

Let me start by saying that my knowledge of Apache is almost none, so I apologize if I am not using the correct terminology.
I have a website written in Vue, and the routing is taken care by Vue Router. In their documentation, they specify that in order for the router to work correctly, you have to put this in the .htaccess file of your website:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
From what I have been able to understand, all requests are sent back to the index.html file which will take care of loading the correct component based on the path.
My goal is to now allow my website to have a path (let's say /documents) which is not picked up by Vue, but instead shows the contents of the directory and allows you to both navigate and download the contents (Like this).
I have tried a few ways, but they all return a 403 or 500 (possibly due to a mistake in my config). I understand that I need to add a RewriteRule but all of those that I tried return weird errors.
Thanks in advance

Answer 1

You can have multiple rewrite rules based on what the RewriteBase is . In your current set, the rule is applying to the root of the host.
You can add another rule with RewriteBase /documents/. More info: What does RewriteBase do and how to use it?

Answer 2

I recommend reading the docs: https://httpd.apache.org/docs/2.4/mod/mod_rewrite.html
The RewriteCond directive defines a rule condition.
So here a dirty explanation:
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
So your RewriteConds says that if the given path/url isn't a file (!-f) and not a directory (!-d) then the next rewrite rule (RewriteRule . /index.html [L]) takes action.
RewriteRule . /index.html [L]
"." is a wildcard, so all urls will be redirect to index.html.
The [L] flags stops the execution (https://httpd.apache.org/docs/2.4/rewrite/flags.html#flag_l)
The RewriteRule ^index\.html$ - [L] stops the execution if the url is index.html.
So, your rewrite rule fulfill your requirements and seems correct.
When you get a 403 you maybe need to add Options +Indexes to your config or htaccess.

Answer 3

In the end, after looking through the docs, I was not able to understand how to set it up. I found this page, and using option #2 I was able to get the directory to at least show up.
I then added the auth to the folder through the .htaccess file and added the .htpasswd file with the username/password combo
TLDR
Create the folder in the location you want. In my case it was in httpdocs/documents
Create a .htaccess file where you put the following contents:
# Omit this section if you do not need the auth
AuthType Basic
AuthName "restricted area"
AuthUserFile /path/to/your/.htpasswd
require valid-user
Order allow,deny
Allow from all
Options +Indexes
Create the .htpasswd file in the location you specified above. To generate the username/password combo I used this
Any corrections are welcome!