CSS Javascript and .htaccess problem


#1

Hey guys, for what seems to be the longest time i have been using (across all my websites) PHP 5.3.x FastCGI thinking its better than having to upgrade things later if need be from the (then) default PHP/FastCGI versions.

Anyway, i have consistently had trouble rendering my CSS & Javascripts, until a long time ago i came across a post in here that said their solution was to implement a line of code (AddHandler) in a .htaccess file and a block of code at the beginning of each and every CSS & JS file on their website.

Here’s the .htaccess code:
AddHandler application/x-httpd-php5 .php .html .htm .css .js

The CSS:

<?php ob_start ("ob_gzhandler"); header("Content-type: text/css"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 * 24 * 3; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; Header($ExpStr); ?>

And the Javascript:

<?php ob_start ("ob_gzhandler"); header("Content-type: text/javascript"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 * 24 * 3; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; Header($ExpStr); ?>

So i tried this, and it worked, i a/b tested against the earlier (default at that time) version of PHP/FastCGI and things have been relatively ok.

During this time i have had need to setup wordpress, which have a few CSS/JS files and every attempt to install has never worked, even after implementing the above mentioned code in each file, the same has been true of other programs, including magento and membersgear.

What gets me is that now i see that PHP 5.3.x FastCGI is your default, so why should i need to be making sitewide AddHandler changes to each and every offending file and still am unable to install the above mentioned program even whilst using one click install from the DH panel?

Can someone enlighten me as to where to go from here? I am very tired of making repetitive changes, perhaps its a server issue (in this case “jets”).

Please advise, many thanks


#2

Everything you are trying to do above can be done more efficiently with .htaccess

You don’t need to worry about compression because that’s enabled by default in DH’s apache setup


#3

As it stands bobocat, i am aware it is compressing the data but at the time i was looking for a simple way to get my css and JS working correctly, so i left the working code as is, right now though it is a very tedious process to be adding/updating so many files.

Are you saying i only need to place the .htaccess file? Funnily enough i never even thought of that, or would i need to be identifying the file type lines as well?:

header(“Content-type: text/javascript”);
header(“Cache-Control: must-revalidate”);

Many thanks for your input.


#4

First of all, you take all that stuff out of your CSS and JS files:

[code]$ cat /tmp/test.css

<?php ob_start ("ob_gzhandler"); header("Content-type: text/css"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 * 24 * 3; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; Header($ExpStr); ?>

body { display: none; }

$ sed -i ‘/<?php/,/?>/ d’ /tmp/test.css

$ cat /tmp/test.css
body { display: none; }
[/code]

If you have many, you simply use find:

find ~ -type f -iregex ".*\.\(css\|js\)$" -exec sed -i '/<\?php/,/\?>/ d' {} +

Then you ask yourself what you really want to do. Just add expires and must-revalidate headers? You can do that by following instructions such as these.


#5

Just a quick query: Did you select to use that auto-Google rubbish when setting up the domain?


#6

bobocat, understood, actually i am surprised i actually understood your second piece of code there with the RegEx’s LOL but either way, the primary purpose in having the code there at the time was that the webpages weren’t rendering any css or javascript at all, which was why i placed the css/js/htaccess code “solution” at the time in its entirety.

So i just did a test using one css file and the .htaccess file, i removed all of the offending css php section in the css file and i lost all css formatting as a result, the least amount of code that would allow the page to properly display the css was this:

<?php header("Content-type: text/css"); ?>

AND i had the .htaccess file in place with only this line:
AddHandler application/x-httpd-php5 .php .html .htm .css .js

if i removed either line from EITHER file from therein i lose all css formatting on my resulting php page. I can only expect that the same would be true for the javascript files

I have nothing setup apart from defaults in DH web panel, i use gmail/google services but as they are on separate servers there is nothing that should be at play there.

Appreciating your efforts btw.
Many thanks
Z

[hr]
sXi, yes mate, i set up the google mail services, but as i just explained to bobocat, it shouldnt bear any relevance as the gmail services et al are hosted on a seperate server with nothing but dns settings to point to them.

Everything else has been set as default.

Many thanks
Z


#7

[quote=“ziller, post:6, topic:59031”]
So i just did a test using one css file and the .htaccess file, i removed all of the offending css php section in the css file and i lost all css formatting as a result

if i removed either line from EITHER file from therein i lose all css formatting on my resulting php page.[/quote]

Samples? CSS does not need need anything special such as that or else static sites wouldn’t even work.


#8

Samples indeed… I have just setup an example here, first with css working correctly:
http://www.residentkennedy.com/blogg/index.php
and the offending code within:
http://www.residentkennedy.com/blogg/blogStyles.css

And here is a copy of the same file working incorrectly:
http://www.residentkennedy.com/blogg/index2.php
and the css with offending code removed is here:
http://www.residentkennedy.com/blogg/blogStyles2.css

Naturally the .htaccess file is in place with the AddHandler, although it is now plain that both sets of code are needed to render the css properly.

One other thing i forgot to mention, i am creating the php/html files using html5 headers, but i dont believe that has any bearing as i have had this problem since before i started using html5.

I should also add that when i use the css in the header of any php/html file and NOT in a seperate CSS file, it renders correctly

As a sample this is as random as i could get, all my css files act in the same fashion, without exception.

Many thanks
[hr]
Thought i’d best add the header portion of the index.php file, apologies (obviously this example is not html5 lol):

<?php echo $pageTitle ?> @import "blogStyles.css";

Hope it helps

Z


#9

http://www.residentkennedy.com/blogg/blogStyles2.css is being sent as text/html

HTTP/1.1 200 OK Date: Sun, 13 Jan 2013 10:04:14 GMT Server: Apache Vary: Accept-Encoding Content-Type: text/html Content-Length: 747 Connection: Keep-Alive Content-Encoding: gzip Age: 0

what’s in your .htaccess?


#10

AddHandler application/x-httpd-php5 .php .html .htm .css .js

Options -Indexes
ErrorDocument 404 https://residentkennedy.com/404error.php
ErrorDocument 403 https://residentkennedy.com/403error.php
ErrorDocument 500 https://residentkennedy.com/500error.php

that’s it!


#11

remove ‘.css .js’ from the line above

and you don’t need ‘.php’ either because apache is already configured to recognize that extension


#12

Just removed all three but now, as you can see for yourself, neither index nor index2 render css


#13

I was referring to the pagespeed option crappery. But anyway your problem is that someone’s set PHP to handle everything via the htaccess directive. You should really remove that entire line unless you have an ultra-specific use for it.


#14

You either have another .htaccess somewhere in your directory tree which still has the same command, or you have a framework which is intercepting all requests and sending your files as html. Your css is still being sent as text/html:

[code]Request
URL:http://www.residentkennedy.com/blogg/blogStyles2.css
Request Method:GET
Status Code:200 OK

Request Headers

GET /blogg/blogStyles2.css HTTP/1.1
Host: www.residentkennedy.com
Connection: keep-alive
Cache-Control: no-cache
Pragma: no-cache
User-Agent: Mozilla/5.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US
Accept-Charset: UTF-8,*;q=0.5

Response Headers

HTTP/1.1 200 OK
Date: Sun, 13 Jan 2013 10:34:08 GMT
Server: Apache
Vary: Accept-Encoding
Content-Type: text/html
Content-Length: 747
Connection: Keep-Alive
Content-Encoding: gzip
Age: 0[/code]


#15

But, sXi, if i remove that line, the php page doesnt render css at all, this is the only reason that line exists in the .htaccess file.

Original problem: without the added code, the php pages were not rendering css unless the css was inside the php file.

Original solution: added the Addhandler line into .htaccess and the php code block in all css and js files sitewide.

This now seems to be more of a DH server config problem from what i can tell.


#16

The problem is (probably) your ‘php’ pages have an html extension. You use AddHandler to tell apache to treat those as php. That’s all you need. You don’t want to run your css and js through php as well. Your original ‘solution’ is not a solution at all. It’s a kludge that obfuscates the problem, which is why you needed to add php code to all of your css and js to make anything work. That’s not a solution at all.


#17

Can you explain what you mean by “The problem is (probably) your ‘php’ pages have an html extension.” ? You mean the .php pages have html within them? As i say, if i remove EITHER the addhandler OR the code in the external css file, no css is rendered

Up until this i had used php with embedded html on other servers and never had to use an addhandler to get css or js to work, this is what leads me to question the Jets server config.

I realise it was always a kludge, but i found it on DH forum a long time back and it helped thus far but i need to clean this up, so, here i am lol I do appreciate (both) your efforts though.


#18

You remove both the AddHandler and the php code in your css and js.

you only need AddHandler when you have files with .html extensions that have php code inside.


#19

Yes, i have done this numerous times, but the css does not render, otherwise i would never had needed the kludge.

I just renamed the .htaccess file to 11111.htaccess and both the index.php and index2.php files fail to render css, one file has the php code block in it, the other does not, as per our earlier samples, but both fail to render.


#20

As a test, create a new directory in that exact userspace called “basic” and add the following 3 files:

.htaccess - (add and remove handler to make sure it’s really wiped for this dir) :

AddHandler application/x-httpd-php5 .php .html .htm .css .js RemoveHandler application/x-httpd-php5 .php .html .htm .css .js

basic.css :

basic.html :

[code]

Hello, World!

[/code]

Does “Hello, World!” display in blue?