Kombinierte Ansicht Flache Ansicht Baumansicht
Threads [ Zurück | Nächste ]
toggle
Tobias Gindler
CSS and js caching using HTTPS
6. November 2008 02:11
Antwort

Tobias Gindler

Rang: Junior Member

Nachrichten: 71

Eintrittsdatum: 23. März 2007

Neue Beiträge

Hello,

we are using the liferay-portlet.xml file to bind all css and js files needed by our portlets.
Using HTTP everything works fine and all files were loaded once and were put into the browser cache.

Using HTTPS we encountered the following problem. Liferay adds a query string at the link definition for the css and js files.

for example: <link href="/some_css.css?t=1225902255437" rel="stylesheet" type="text/css" />

Under HTTPS almost every browser denies to cache "dynamic" contents (especially contents with a query string)
That leads to some cruel reloading extra times caused by the reloading of all bound css and js files at every render request.

Is there a way to deactivate the timestamp attachment for the css and js files or to enable the caching for those files?

Thank you very much

Tobias
Frederik Weishäupl
RE: CSS and js caching using HTTPS
21. November 2008 09:01
Antwort

Frederik Weishäupl

Rang: Junior Member

Nachrichten: 46

Eintrittsdatum: 7. Januar 2006

Neue Beiträge

Hi Tobias,

I've got the same problem here... this non-caching of the javascript files with HTTPS is definitely a performance killer.

Did you already find a solution for this issue?
Rob Sonke
RE: CSS and js caching using HTTPS
21. November 2008 10:41
Antwort

Rob Sonke

Rang: Expert

Nachrichten: 275

Eintrittsdatum: 26. August 2007

Neue Beiträge

I found this discussion:

http://stackoverflow.com/questions/174348/will-web-browsers-cache-content-over-https

Seems that IE is acting like you specify in the headers and that it's fixed in firefox 3.
Tobias Gindler
RE: CSS and js caching using HTTPS
2. Dezember 2008 04:29
Antwort

Tobias Gindler

Rang: Junior Member

Nachrichten: 71

Eintrittsdatum: 23. März 2007

Neue Beiträge

Hello Frederik,

I've checked the servers http response headers via a proxy tool.
By default, no caching headers will be set for custom css and js files that are included via the liferay-portlet.xml

I have created a simple filter class, that sets the http headers for caching the custom css and js files.

This solution will not work with Firefox < 3, but i hope that it will work with the other browsers.

Best regards

Tobias
Tobias Gindler
RE: CSS and js caching using HTTPS
2. Dezember 2008 06:59
Antwort

Tobias Gindler

Rang: Junior Member

Nachrichten: 71

Eintrittsdatum: 23. März 2007

Neue Beiträge

Hello,

Firefox < 3 will cache ssl request if you change a config parameter.
Therefore you have to enter the url about:config and you have to toggle the 'browser.cache.disk_cache_ssl' to true.

Afterwards the caching seems to be done as it is specified at the server response http headers.

Best regards

Tobias
Frederik Weishäupl
RE: CSS and js caching using HTTPS
3. Dezember 2008 02:08
Antwort

Frederik Weishäupl

Rang: Junior Member

Nachrichten: 46

Eintrittsdatum: 7. Januar 2006

Neue Beiträge

Hi Tobias,

thanks for your hints.

I have created a simple filter class, that sets the http headers for caching the custom css and js files.


Would it be possible to attach your filter class to this forum thread? That would be great

Regards,

Frederik
Tobias Gindler
RE: CSS and js caching using HTTPS
3. Dezember 2008 02:35
Antwort

Tobias Gindler

Rang: Junior Member

Nachrichten: 71

Eintrittsdatum: 23. März 2007

Neue Beiträge

Hi Frederik

Here is the sourcecode of the filter
 1
 2package somepackage;
 3
 4import java.io.*;
 5import javax.servlet.*;
 6import javax.servlet.http.*;
 7
 8public class CachingFilter implements Filter
 9{
10    
11     public void init(FilterConfig config) throws ServletException{}
12     public void destroy(){}
13    
14     public void doFilter(ServletRequest request, ServletResponse response, FilterChain next)
15     throws IOException, ServletException
16     {
17          try {
18         
19              HttpServletResponse vResponse = (HttpServletResponse) response;             
20              vResponse.setHeader("Cache-Control", "max-age=172801, public");   
21             
22          } catch (ClassCastException e) {
23            
24          }
25          next.doFilter(request, response);
26     }
27   
28    
29}


You have to add the following to your web.xml to apply the filter:
 1<filter>
 2    <filter-name>cachingFilter</filter-name>
 3    <filter-class>somepackage.CachingFilter</filter-class>
 4</filter>
 5
 6<filter-mapping>
 7    <filter-name>cachingFilter</filter-name>
 8    <url-pattern>/css/*</url-pattern>
 9</filter-mapping>
10<filter-mapping>
11    <filter-name>cachingFilter</filter-name>
12    <url-pattern>/js/*</url-pattern>
13</filter-mapping>


Hope that will help you.

Best regards

Tobias
Frederik Weishäupl
RE: CSS and js caching using HTTPS
3. Dezember 2008 02:56
Antwort

Frederik Weishäupl

Rang: Junior Member

Nachrichten: 46

Eintrittsdatum: 7. Januar 2006

Neue Beiträge

Great :-) Thx a lot!