Home > Software design >  how to rewrite the htaccess rules to redirect to css files
how to rewrite the htaccess rules to redirect to css files

Time:10-30

The goal is to be able to access CSS files this way /css/index.css in the index.php file, but the real path to the CSS files are ./resources/styles/index.css.

If user opens the website e.g. https://stackoverflow.com/

It must redirect the user to the public/index.php file (entry-point), but at the same time all CSS files (which are in real are located under resources/styles/ directory, and they must be accessible using this url:https://stackoverflow.com/css/index.css, and applied accordinly to the HTML page.

My current project structure:

public/
├─ .htaccess
├─ index.php
resources/
├─ styles/
│  ├─ index.css
│  ├─ main.css
.htaccess

My ./public/index.php file (MUST be the entry-point):

<!doctype html>
<html lang="en">
<head>
    <link rel="stylesheet" href="/css/index.css">
    {{-- but the actual path to index.css is "./resources/styles/index.css"--}}
</head>
<body>
...
</body>
</html>

I have tried this .htaccess config (from the root directory), but it returns me Not Found - 404 page:

RewriteEngine on

RewriteBase /
RewriteCond %{REQUEST_URI} /resources/styles/.*
RewriteRule ^resources/styles/(.*)$ /css/$1 [QSA,L]
RewriteRule ^$ public/ [L]
RewriteRule (.*) public/$1 [L]

What do I miss here? Please describe it with some extra details if possible.

My ./public/.htaccess config:

RewriteEngine On
# RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.php [QSA,L]

Also, what would be the best way to do the same for these([js, fonts, images]) types?

I know that this could be done in apache config this way:

...
Alias /css "/var/www/html/resources/styles"
<Directory /var/www/html/resources/styles>
                Options FollowSymLinks
                AllowOverride None
                Require all granted
</Directory>
...

Please, correct me if something is missing in the apache config.

But, currently, I need to be able to use the .htaccess file.

I have tried reading this posts:

CodePudding user response:

You can have these rules in your site root .htaccess:

RewriteEngine On

# rewrite css files to their actual path
RewriteRule ^css/(. \.css)$ resources/styles/$1 [L,NC]

# rewrite js files to their actual path
RewriteRule ^js/(. \.js)$ resources/js/$1 [L,NC]

# write root to public/
RewriteRule ^$ public/ [L]

RewriteRule ^(?!resources/).* public/$0 [L,NC]
  • Related