Lost css/js after setting on gzip comression - javascript

So I decided to try gzip on my website and finally found script fully accteptable by Google PageSpeed Insights which increase my score to 86/100 from 72/100. The only problem is that all of my gzipped jsess and cssess disappear and the website looks like there is no .css file at all. I honestly have no idea why this isn't working correctly.
Here's the code I put it in .htaccess
RewriteEngine On
RewriteBase /
<IfModule mod_headers.c>
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.css $1\.css\.gz [QSA]
RewriteCond %{HTTP:Accept-encoding} gzip
RewriteCond %{REQUEST_FILENAME}\.gz -s
RewriteRule ^(.*)\.js $1\.js\.gz [QSA]
RewriteRule \.css\.gz$ - [T=text/css,E=no-gzip:1]
RewriteRule \.js\.gz$ - [T=text/javascript,E=no-gzip:1]
<FilesMatch "(\.js\.gz|\.css\.gz)$">
Header set Content-Encoding gzip
Header append Vary Accept-Encoding
</FilesMatch>
Thanks in advance for any help

Related

Is it possible to enable gzip compression in nuxt static?

i've tried to use this config to my httacces file, but it doesnt work. the assets still has no encode
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_URI} .*\.(css|html|js)
RewriteCond %{REQUEST_FILENAME}.gz -s
RewriteRule ^(.+) $1.gz Apache for recompressing the files
RewriteRule "\.css\.gz$" "-" [T=text/css,E=no-brotli,E=no-gzip]
RewriteRule "\.html\.gz$" "-" [T=text/html,E=no-brotli,E=no-gzip]
RewriteRule "\.js\.gz$" "-" [T=application/javascript,E=no-brotli,E=no-gzip]
<FilesMatch "\.(css|html|js)\.br$">
RemoveLanguage .br
Header set Content-Encoding br
Header append Vary Accept-Encoding
</FilesMatch>
<FilesMatch "\.(css|html|js)\.gz$">
Header set Content-Encoding gzip
Header append Vary Accept-Encoding
</FilesMatch>

How do you do dynamic url. example.com/profile/CroatiaGM

I am doing the user control panel, and I have some problems I am not sure how to do this dynamic profile link currently. example.com/profile/CroatiaGM What would be the best way to go about this, My site is mainly PHP, is it better to use js or?
I'm assuming you're looking to rewrite a URL, where you'd like to rewrite example.com/profile.php?user=CroatiaGM to example.com/profile/CroatiaGM.
in such an instance I believe this would be helpful if you don't already have a .htaccess file, I suggest you create one in your main directory/public_html
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteBase /
RewriteRule ^profile/([^/]+)?$ profile.php?username=$1
RewriteRule ^profile/([^/]+)/([^/]+)?$ profile.php?username=$1&type=$2
</IfModule>
or
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^([^/]+)/([^/]+)?$ $1.php?username=$2
RewriteRule ^([^/]+)/([^/]+)/([^/]+)?$ $1.php?username=$2&type=$3
</IfModule>
Here's a working example.
https://locationtestproject.000webhostapp.com/test/myname
I strongly advise making a back of the .htaccess before saving any changes.
https://help.dreamhost.com/hc/en-us/articles/215747748-How-can-I-redirect-and-rewrite-my-URLs-with-an-htaccess-file-
How to use .htaccess for beautiful links
https://docs.bolt.cm/4.0/howto/making-sure-htaccess-works
https://alexcican.com/post/how-to-remove-php-html-htm-extensions-with-htaccess/

.htaccess blocks images from mobile site aka root/mobile

I been researching countless topics regarding accessing images when a user is logged into a mobile site. I'll try to explain everything to the point and any help is super appreciated.
I have website (root/index.html) and a mobile version redirected to (root/mobile/index.html) via .htaccess
I have all my subscribers individual folder accounts as followed: (root/1234567, root/1122334, root/9876543, etc..) with their uploaded images inside (root/1234567/image1.png, etc...)
When a user logs into mobile via (root/mobile/login.php) and tries to view an image via JavaScript www.mysite.com/1234567/image1.png it "breaks".
I tried all suggestions in my research, however when I delete .htaccess from root it works so I know the root .htaccess file is the culprit but I do need security on subscribers folders (root/1234567 etc...) but allow access on image files within subsribers folders. I can post both .htaccess files contents of root and root/mobile
Here's my root .htaccess file
RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
RewriteCond %{HTTP_USER_AGENT}
"android|blackberry|iphone|ipod|ipad|iemobile|opera
mobile|palmos|webos|googlebot-mobile" [NC]
RewriteRule ^((?!mobile/).*)$ /mobile [L,R=301]
<FilesMatch "\.(htaccess|htpasswd|ini|log|sh|inc|bak|txt)$">
Order Allow,Deny
Deny from all
</FilesMatch>
ErrorDocument 403 https://www.mysupersite.com/
ErrorDocument 404 https://www.mysupersite.com/
Options -Indexes
And my root/mobile .htaccess file
RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^ https://www.mysupersite.com/mobile [L,R=301]
RewriteCond %{HTTP_USER_AGENT}
"!android|blackberry|iphone|ipod|ipad|iemobile|opera
mobile|palmos|webos|googlebot-mobile" [NC]
RewriteRule ^ https://www.mysupersite.com [L,R=301]
<FilesMatch "\.(htaccess|htpasswd|ini|log|sh|inc|bak|txt)$">
Order Allow,Deny
Deny from all
</FilesMatch>
ErrorDocument 403 https://www.mysupersite.com/mobile
ErrorDocument 404 https://www.mysupersite.com/mobile
Options -Indexes

How to send all request to index.html - reactjs

I'm using linux OS and apache.
I created a webapp directory inside public_html. inside public_html I have a landing page. I want to keep this landing page.
all resources can fetch as well.
but I got Page not found error.
I found out that I should send all requests to index.html file.
.htaccess file:
<ifModule mod_rewrite.c>
#######################################################################
# GENERAL #
#######################################################################
# Make apache follow sym links to files
Options +FollowSymLinks
# If somebody opens a folder, hide all files from the resulting folder list
IndexIgnore */*
#######################################################################
# REWRITING #
#######################################################################
# Enable rewriting
RewriteEngine On
# If its not HTTPS
RewriteCond %{HTTPS} off
# Comment out the RewriteCond above, and uncomment the RewriteCond below if you're using a load balancer (e.g. CloudFlare) for SSL
# RewriteCond %{HTTP:X-Forwarded-Proto} !https
# Redirect to the same URL with https://, ignoring all further rules if this one is in effect
RewriteRule ^(.*) https://%{HTTP_HOST}/$1 [R,L]
# If we get to here, it means we are on https://
# If the file with the specified name in the browser doesn't exist
RewriteCond %{REQUEST_FILENAME} !-f
# and the directory with the specified name in the browser doesn't exist
RewriteCond %{REQUEST_FILENAME} !-d
# and we are not opening the root already (otherwise we get a redirect loop)
RewriteCond %{REQUEST_FILENAME} !\/$
# Rewrite all requests to the root
RewriteRule ^(.*) /
</ifModule>
<IfModule mod_headers.c>
# Do not cache sw.js, required for offline-first updates.
<FilesMatch "sw\.js$">
Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</FilesMatch>
</IfModule>
but I got not found message error:
https://parsebar.com/webapp/login
I use this snippet in my .htaccess when my react app runs in a subfolder:
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

Gzipped javascript not being served properly

I have a js file and a gzipped version of this js file.
The problem I am facing is trying to serve the gzipped version of this js file to the browsers that support it.
I don't know how to do that. If I add the js.gz to the current script element then it is not loaded and gives error.
How can I automatically serve the gzipped version of this js to the supported browsers.
Also I would like to restrict the gz serving the the folder /resources/widget/
I don't want to compress on the fly as i have around 1000 requests per second and it would take minutes to take down the server. Each js file is about 100KB and js.gz is about 16KB, so I would appreciate if I could be helped with my current files.
RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} “.*Safari.*” [OR]
RewriteCond %{HTTP:Accept-Encoding} !gzip
RewriteRule (.*)\.jgz$ $1\.js [L]
AddType “text/javascript;charset=UTF-8″ .jgz
AddEncoding gzip .jgz
rename your files from .gz to .jgz
OR use
<FilesMatch "\\.js.gz$">
ForceType text/javascript
Header set Content-Encoding: gzip
</FilesMatch>
<FilesMatch "\\.js$">
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} !".*Safari.*"
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule (.*)\.js$ $1\.js.gz [L]
ForceType text/javascript
</FilesMatch>
I have encountered problems with some browsers (notably Safari) not dealing appropriately when the file name extension was ".gz". We had to work around this by renaming the files to ".jgz"
You can use httacces to gzip for you, to browsers that support it:
see:
http://betterexplained.com/articles/how-to-optimize-your-site-with-gzip-compression/
if you're using php :
In your htaccess file :
RewriteEngine On
RewriteRule (.*)\.js compress-js.php?file=$1.js [L]
compress-js.php :
ob_start("ob_gzhandler");
header("Content-type: text/javascript; charset: ISO-8859-1");
echo (file_get_contents ($file));
That's all you need your files will be served in a compressed format.
Just add these 2 files .htaccess and compress-js.php to your js folder or wherever you store them.

Categories