How to solve CSS include error after Apache RewriteRule? - css

I use winXP and AppServ. I have a "showitem.php" on my website root. An example usage:
www.mydomain.com/showitem.php?id=123
I want to use links like following:
www.mydomain.com/item/123
In .htaccess I write this line:
RewriteRule ^item/([^/]+)$ showitem.php?id=$1
Server directs to showitem.php and id is received successfully. However, main problem is with the css and js files. If I make "css/style.css" to "/css/style.css", page is shown on the internet and but not on localhost, because root is "localhost" but files are under "localhost/mydomain". I have also tried "!-f" condition for .css files but it doesn't help and it can't as far as I understand. To solve the problem, I should direct wrong css file interpretation to the correct place, so I want to redirect client request "item/css/style.css" to its original location "css/style.css". I add the following rules for localhost but is there any other way?
RewriteRule ^item/css/([^/]+)$ /mydomain/css/$1
RewriteRule ^item/img/([^/]+)$ /mydomain/img/$1

Set a base tag in your html head.
<base href="http://www.mydomain.com/" />
And then set your stylesheet linking paths relative to the base, e.g.
<link href="css/style.css" />

you could write these to the file .htaccess
ErrorDocument 404 /error_404.php
/error_404.php is your error file you want to put something in there.

Related

F3 routing engine works using XAMPP and PhpStorm on Linux, but gives 404 for CSS files

I'm trying to code a F3 ("Fat Free Framework") application using PhpStorm and XAMPP on Linux.
In order to make use of the .htaccess file provided by F3 necessary for the RewriteEngine (see the comments as why this is wrong), I launch my code using the following special run configuration :
I launch the run configuration, which starts the Web Server. I open a browser and go to http://localhost:8000/ . I can see the content, and the links work and I can navigate from page to page, per the routes defined.
But none of the CSS is there. If I click on "view-source" and click on the CSS link, I get the 404 Not Found message from F3. So, it seems that for some reason, F3 is blocking CSS files.
The beginning of the webpage is as follow:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A title</title>
<link href="{{#BASE}}/f3style.css" rel="stylesheet" type="text/css" />
</head>
Although the #BASE variable is empty in my case. The "f3style.css" file is really at the root of my web directory currently.
I use the default .htaccess file recommended by F3:
RewriteEngine On
# Uncommenting the following line has no effect
# RewriteBase /
RewriteRule ^(app|tmp)\/|\.ini$ - [R=404]
RewriteCond %{REQUEST_FILENAME} !-l
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule .* index.php [L,QSA]
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization},L]
(Again, see the comments as to why the .htaccess file is irrelevant here)
And here are my routes. They are in "index.php":
<?php
$f3 = require('lib/base.php');
// Routes
require 'controller.php';
$f3->route('GET /index.php', 'Controller->showMain');
$f3->route('GET /', 'Controller->showMain' );
$f3->route('GET /items/#item', 'Controller->showItem');
$f3->run();
Any idea what I should look for?
Based on the screenshot you are using PHP's built-in web server. The thing is: it does not support .htaccess. Therefore all HTTP requests go to your router script (framework/index.php -- part of the F3 app I guess).
I'm not familiar with how F3 routing works, but I'd assume it's the same as any other: it goes through all registered routes/endpoints and if no match found it will report "404 Not Found" response.
Since there are no rules from .htaccess in place to filter out requests for such static/existing files (css/jpg/png/js etc), the request goes through your index.php, through the whole routing table and it's F3 that reports that 404 error back to the browser (when no matching route was found).
There are a few possible solutions here:
Create a separate route(s) for such static resources and serve them there from your F3 code (your code needs to locate a file and send a response with the right headers etc.)
Not really worth implementing it this way TBH (since it's just to handle this specific situation / under PHP's web server).
Do a pre-filter and ignore any requests to such static files. When using PHP's web server it's a matter of returning false in the router script (which tells PHP to use built-in web server code to serve such request). Look at the sample from the following link and add a similar one to your code: https://www.php.net/manual/en/features.commandline.webserver.php#example-426
if (preg_match('/\.(?:png|jpg|jpeg|gif|css)$/', $_SERVER["REQUEST_URI"])) return false;
NOTE: you can add it right into the existing index.php like you did (at the top, after all use lines but before actual code lines) but this means that you are hardcoding such specific-to-PHP's-web-server-only logic into the script that can run under a proper web server.
Instead I suggest creating a separate router script (e.g. php-router.php and use it instead of index.php from your screenshot) where you will do this and if execution will pass that condition, only then call the code from your real index.php (i.e. require './index.php'; or alike)
Why not use Apache web server from your XAMPP to serve the whole site in the first place?
Once Apache is running it handles ALL of the virtual hosts (that you can access via fake domain name in your OS' hosts file or by having website on a custom dedicated port) -- no need to launch each site separately.
Apache obviously fully supports .htaccess and always better/more features/more close to the production environment than for-dev-only PHP's built-in web server (mod_rewrite and other modules).

Invalid image url throws exception

If I try to visit an invalid image url e.g. example.com/images/non-existent-image an error is thrown: Symfony\\Component\\Routing\\Exception\\ResourceNotFoundException
How should I prevent this, is there a specific route(-requirement) I should add, or should I use something like a .htaccess rule?
Thanks
If it was a permission error you would get sth like permission denies. Check again the path...also check that you have placed the folder images in the proper directory in server (try moving images/ in the same directory where directory WEB-INF is..files under WEB-INF cannot be accessed for security reasons)
Okay the answer to this question is twofold.
First of all: Yes, static resources should not be requested via the front controller (as per thecatontheflat's comment). Symfony has a rule in the .htaccessfile distributed with the standard edition:
# If the requested filename exists, simply serve it.
# We only want to let Apache serve files and not directories.
RewriteCond %{REQUEST_FILENAME} -f
RewriteRule .? - [L]
As it turned out, my problem was somewhere else. It is normal for symfony to throw the ResouceNotFoundException. However , this error should be caught and should create a 404 instead. This was not happening because I was using IS_GRANTEDin my error template. (Also see stof's comment here)

Apache alias not working, WAMP

I am using WAMP.
I edited the httpd.conf file to include:
Alias /static "c:/he/sites/browsbyboodah.com/htdocs/static"
When linking my .css's I use this path:
<link rel="stylesheet" type="text/css" href="/static/css/reset.css" />
I cannot load the .css like this for some reason. What am I forgetting?
Thanks.
/* EDIT */
After a little debugging I found the following from a view page source and clicking on the css file:
Page not found (404)
Request Method: GET
Request URL http://127.0.0.1:8000/static/css/reset.css
css\reset.css could not be found
check whether Apache mod_alias module is installed or not? and remove "
Alias /static/ /sites/browsbyboodah.com/htdocs/static/
alternatively you can use AliasMatch Directive
One subtle difference between Alias and AliasMatch is that Alias
automatically copies any additional part of the URI onto the end of
the file path on the right. AliasMatch does not.
AliasMatch ^/static/(.*)$ /sites/browsbyboodah.com/htdocs/static/$1
Read this article for more help

htaccess rewrite condition miss css and image

i'm tryng to use a rewrite condition like this:
www.sitename.com/view/post/1
and rewrite to:
www.sitename.com/view_post.php?id=1
I'm using this code:
RewriteRule view/post/([^/]+) view_post.php?id=$1 [L]
But on this page the linked css and images were missed if i link them like this:
css/style.css
It's possible to avoid this error also when working in localhost/sitename for developing with the same htaccess? thanks a lot
If you use relative URIs then the same and code will work on multiple sites, e.g. www.sitename.com and localhost.
Why not add 127.0.0.1 localhost www.sitename.home to your hosts file and then you can test locally using http://www.sitename.home/whatever_uri
The issue on the CSS is that the browser will resolve a relative URI of css/style.css from a referring www.sitename.com/view/post/1 as www.sitename.com/view/post/css/style.css. Do you see why? You either need to swap all of your app references to site-relative, directory-absolute /css/style.css as Danilo suggests -- and which might involve a lot of rework -- or use an additional rule to dump the extraneous directories:
RewriteRule .*/css/(.*?)\.css css/$1.css [L]
Do you see how this works? :-)
try using
<link rel="stylesheet" type="text/css" href="http://www.sitename.com/css/style.css">
If you want test you app on localhost you must use
<link rel="stylesheet" type="text/css" href="/css/style.css">

How do I edit the .htaccess file to point to a relative directory for a 404 error document?

Most htaccess 404 error rules are based on an absolute directory location, eg /404.php. I want one that is relative to the location it's placed in (so when I transfer from test environment in WAMP to live, I don't have to hope I edit the file right).
Unfortunately,
ErrorDocument 404 404Error.php
Just prints out 404Error.php to the browser, it doesn't call the actual error page like
ErrorDocument 404 /FOOBAR/404Error.php
does.
Edit:
I guess I wasn't clear enough. Test environment is a WAMP local server, with the error file at /FOOBAR/404Error.php while the 'live' server would be www.fubar.com/404error.php -- placing it in the root.
How's this?
ErrorDocument 404 ../directory/404page.html
RewriteBase /FOOBAR/
ErrorDocument 404 404Error.php
This works too, but Tycho's solution is a bit more elegant. Only use this one if you don't plan on using .htaccess for anything outside of /FOOBAR/ pretty much.

Resources