.htaccesstrailing-slashcustom-error-pages

Adding a trailing slash to a non-existing directory displays the 404 page without its css file


(I was having trouble coming up with a good question description, sorry!)

I have a 404.php page setup, and it is also defined in my .htaccess file.

THE PROBLEM:

If you type in https://www.mentat.com.au/abc (where abc is a non-existing directory), it gives you the correct 404.php page displaying as it should.

However, if you type in https://www.mentat.com.au/abc/ (with a trailing slash), it gives the 404.php page, but without the css file downloaded.

Here is my .htaccess file:

#### You need this system flag  ####
RewriteEngine On

#### Force HTTPs ####
RewriteCond %{HTTPS} off 
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

#### Moving all page files with same name, but extentions from .asp to .php ####
RewriteCond %{HTTP_HOST} ^mentat\.com\.au$ [OR]
RewriteCond %{HTTP_HOST} ^www\.mentat\.com\.au$
RewriteRule ^(.*)\.asp$ "https\:\/\/www\.mentat\.com\.au\/$1\.php" [R=301,L]

#### Assign 404 error page ####
   <IfModule mod_rewrite.c>
   ErrorDocument 404 /404.php
  </IfModule>

MY QUESTION:

So, why goes the trailing slash break my 404.php page?

Thanks for any suggestions on how to fix this.

Cheers, SunnyOz


Solution

  • THE ANSWER:

    I've found the answer here: 404 error handling with htaccess and css

    Since the 404 page could be displayed from any directory, you will need to use absolute paths for any external page assets like CSS files, images, JavaScript files, etc.

    So any relative paths, will need to be changed to absolute paths. (I added the preceding slash (/) before all assets, and links, etc.)

    NOTE: I still don't understand why the 404 assets did correctly appear (before I fixed the file) for the URL without the trailing slash. In my mind, I would have thought both URLs (with or without trailing slash) would have had the same problem of missing assets .

    If anyone can provide the reason why the URL without the trailing slash originally did work, please drop me a comment!

    (I am wondering if it has to do with the fact that when the URL doesn't have the trailing slash - then the system doesn't recognize it as an actual directory? So it assumes it is still in the root directory? And therefore the relative path does pick up the assets?)