I'm having the following error Font from origin 'http://static.example.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.example.com' is therefore not allowed access.
I am using the following COR setting in .htaccess file here below
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 1 month"
ExpiresByType text/cache-manifest "access plus 0 seconds"
........
<IfModule mod_headers.c>
Header append Cache-Control "public"
<FilesMatch "\.(ttf|otf|eot|woff|svg)$">
SetEnvIf Origin "^http://(.*)?example.com$" origin_is=$0
Header set Access-Control-Allow-Origin %{origin_is}e env=origin_is
</FilesMatch>
<FilesMatch "\.(js|css|xml|gz)$">
Header append Vary: Accept-Encoding
</FilesMatch>
</IfModule>
</IfModule>
Please I need help with this
Try this in your .htaccess file:
# Allow font assets to be used across domains and subdomains
<FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>
You can read more about this issue in this excellent article I found: https://expressionengine.com/learn/cross-origin-resource-sharing-cors
Try adding this to your .htaccess file:
Header add Access-Control-Allow-Origin "http://example.com"
Alternative:
Header add Access-Control-Allow-Origin "*"
You can also try this
<FilesMatch ".(eot|ttf|otf|woff)">
Header set Access-Control-Allow-Origin "*"
</FilesMatch>
More at https://davidwalsh.name/cdn-fonts
I have made an application in Symfony2 and passed the test as GTmetrix or pigdom and return this error:
The Following resources are missing a cache validator. Resources que no not specify a cache validator can not be refreshed efficiently. Specify a Last-Modified or ETag header to enable cache validation for the Following resources:
http://fonts.googleapis.com/css?family=Quintessential
Anyone know how I could remove this error? a greeting.
thanks for your answer:
my htaccess file is :
Options +indexes
Header unset ETag
FileETag None
<FilesMatch "(?i)^.*\.(ico|flv|jpg|jpeg|png|gif|js|css)$">
Header unset Last-Modified
Header set Expires "Fri, 6 Jan 2013 00:00:00 GMT"
ExpiresActive On
ExpiresDefault "access plus 1 year"
Header set Cache-Control "public, no-transform"
</FilesMatch>
AddOutputFilterByType DEFLATE text/html text/css application/javascript
sorry for my english
have you tried testing with YSlow?
You might be having problems with Expire.
Have you modified your .htaccess file?
This might help:
Leverage browser caching
I've just finished a drupal project and I'm going through optimization phase of the site. I've checked cache blocks and CSS and JS aggregation under performance for better load time . but something I noticed, when I run a page speed test or Yslow everything passes but Leverage browser caching. It seems like the expiry date is not set on all the images and css files. My question is do I have to edit .htaccess file or do I need to place the images and css files that are not cached into a particular folder?
Any help is appreciated, many thanks in advance
You can configure Apache to set specific expire / cache control headers for your image/css/js files using mod_expires and mod_headers.
Here are few examples (general examples -- analyse and consult the manual before applying to your system):
<FilesMatch "\.(html|htm|js|css)$">
FileETag None
<IfModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</IfModule>
</FilesMatch>
Caching with both mod_expires + mod_headers
# Turn on Expires and set default to 0
ExpiresActive On
ExpiresDefault A0
# Set up caching on media files for 1 year (forever?)
<FilesMatch "\.(flv|ico|pdf|avi|mov|ppt|doc|mp3|wmv|wav)$">
ExpiresDefault A29030400
Header append Cache-Control "public"
</FilesMatch>
# Set up caching on media files for 1 week
<FilesMatch "\.(gif|jpg|jpeg|png|swf)$">
ExpiresDefault A604800
Header append Cache-Control "public"
</FilesMatch>
# Set up 2 Hour caching on commonly updated files
<FilesMatch "\.(xml|txt|html|js|css)$">
ExpiresDefault A7200
Header append Cache-Control "proxy-revalidate"
</FilesMatch>
# Force no caching for dynamic files
<FilesMatch "\.(php|cgi|pl|htm)$">
ExpiresActive Off
Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</FilesMatch>
I had the same issue for a long time and I just found the trick!
After looking in .htaccess located on drupal's root repository, there is this condition :
<IfModule mod_expires.c> ... </IfModule>
The code located inside is not executed because apache's expires_module is just not enable on my server, check if expires_module is present on list returned by :
sudo apache2ctl -M
If not, just activate it by :
sudo a2enmod expires
sudo a2enmod headers
sudo service apache2 restart
How to enable browser caching for my site? Do I just put cache-control:public somewhere up in my header like this?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
Cache-Control:public;
>
I am using the latest version of PHP developing on the latest version of XAMPP.
To use cache-control in HTML, you use the meta tag, e.g.
<meta http-equiv="Cache-control" content="public">
The value in the content field is defined as one of the four values below.
Some information on the Cache-Control header is as follows
HTTP 1.1. Allowed values = PUBLIC | PRIVATE | NO-CACHE | NO-STORE.
Public - may be cached in public shared caches.
Private - may only be cached in private cache.
No-Cache - may not be cached.
No-Store - may be cached but not archived.
The directive CACHE-CONTROL:NO-CACHE indicates cached information should not be used
and instead requests should be forwarded to the origin server. This directive has the same semantics as the PRAGMA:NO-CACHE.
Clients SHOULD include both PRAGMA: NO-CACHE and CACHE-CONTROL: NO-CACHE when a no-cache request is sent to a server not known to be HTTP/1.1 compliant. Also see EXPIRES.
Note: It may be better to specify cache commands in HTTP than in META statements, where they can influence more than the browser, but proxies and other intermediaries that may cache information.
You can set the headers in PHP by using:
<?php
//set headers to NOT cache a page
header("Cache-Control: no-cache, must-revalidate"); //HTTP 1.1
header("Pragma: no-cache"); //HTTP 1.0
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
//or, if you DO want a file to cache, use:
header("Cache-Control: max-age=2592000"); //30days (60sec * 60min * 24hours * 30days)
?>
Note that the exact headers used will depend on your needs (and if you need to support HTTP 1.0 and/or HTTP 1.1)
As I wrote is best to use the file .htaccess. However beware of the time you leave the contents in the cache.
Use:
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
Where: 604800 = 7 days
PS: This can be used to reset any header
The page at http://www.askapache.com/htaccess/apache-speed-cache-control.html suggests using something like this:
Add Cache-Control Headers
This goes in your root .htaccess file but if you have access to
httpd.conf that is better.
This code uses the FilesMatch directive and the Header directive to add Cache-Control Headers to certain files.
# 480 weeks
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=290304000, public"
</FilesMatch>
This is the best .htaccess I have used in my actual website:
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>
##Tweaks##
Header set X-Frame-Options SAMEORIGIN
## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType text/html "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType text/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 1 month"
</IfModule>
## EXPIRES CACHING ##
<IfModule mod_headers.c>
Header set Connection keep-alive
<filesmatch "\.(ico|flv|gif|swf|eot|woff|otf|ttf|svg)$">
Header set Cache-Control "max-age=2592000, public"
</filesmatch>
<filesmatch "\.(jpg|jpeg|png)$">
Header set Cache-Control "max-age=1209600, public"
</filesmatch>
# css and js should use private for proxy caching https://developers.google.com/speed/docs/best-practices/caching#LeverageProxyCaching
<filesmatch "\.(css)$">
Header set Cache-Control "max-age=31536000, private"
</filesmatch>
<filesmatch "\.(js)$">
Header set Cache-Control "max-age=1209600, private"
</filesmatch>
<filesMatch "\.(x?html?|php)$">
Header set Cache-Control "max-age=600, private, must-revalidate"
</filesMatch>
</IfModule>
For Apache server, you should check mod_expires for setting Expires and Cache-Control headers.
Alternatively, you can use Header directive to add Cache-Control on your own:
Header set Cache-Control "max-age=290304000, public"
The meta cache control tag allows Web publishers to define how pages should be handled by caches. They include directives to declare what should be cacheable, what may be stored by caches, modifications of the expiration mechanism, and revalidation and
reload controls.
The allowed values are:
Public - may be cached in public shared caches
Private - may only be cached in private cache
no-Cache - may not be cached
no-Store - may be cached but not archived
Please be careful about case sensitivity. Add the following meta tag in the source of your webpage. The difference in spelling at the end of the tag is either you use " /> = xml or "> = html.
<meta http-equiv="Cache-control" content="public">
<meta http-equiv="Cache-control" content="private">
<meta http-equiv="Cache-control" content="no-cache">
<meta http-equiv="Cache-control" content="no-store">
Source-> MetaTags
OWASP recommends the following,
Whenever possible ensure the cache-control HTTP header is set with no-cache, no-store, must-revalidate, private; and that the pragma HTTP header is set with no-cache.
<IfModule mod_headers.c>
Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</IfModule>
I was wondering if you could help me, Im trying to set an expiration date on the caching of certain files in my website, are there some tips you could give me how to do that? Ive been able to find some things on how to change entire file types, but not SPECIFIC files. Is that possible?
ExpiresActive On # enable expirations
ExpiresByType image/gif A2592000 # expire GIF images after a month
# in the client's cache
ExpiresByType text/html M604800 # HTML documents are good for a
# week from the time they were
# changed, period
This can help you:
http://viralpatel.net/blogs/2009/06/21-very-useful-htaccess-tips-tricks.html
Check out tip #6: "Implementing a Caching Scheme with .htaccess".
I think you can come up with a specific-file-based handling from here.
<FilesMatch ".(ico|pdf|flv|jpg|jpeg|png|gif|swf|mp3|mp4)$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
Header unset Last-Modified
</FilesMatch>
<FilesMatch ".(html|htm|xml|txt|xsl)$">
Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>
<FilesMatch ".(js|css)$">
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
</FilesMatch>