HTTP to HTTPS (stylesheets, js, css-sprites, etc) reloading

Question

This question has nothing to do with the mixed content error. About to launch a site. When i navigate from http://example.com to https://example.com, i notice that the css/js/etc is redownloaded as i am using root relative paths: .

Using an http sniffer i see that the browser thinks https://www.example.com/_css/main.css is different than http://www.example.com/_css/main.css (its not). Thus the same exact content is downloaded twice causing the site to look slow navigating from http to https (if the user doesn't have both versions cached already).

Is there anyway to stop this? The user will almost always hit up the non-ssl version of the site first so is there a script that will wait until the http content is loaded than maybe force a https version into the users cache? Or should i just use absolute paths (https://www.example.com/_css/main.css) on ever page and on every css background image (only 2 i use sprites). Or do we just live with it? Thanks.

Answer 1

Using an http sniffer i see that the browser thinks https://www.mysite.com/_css/main.css is different than http://www.mysite.com/_css/main.css (its not).

It is a different resource with identical content. The browser has no way to know that they are going to have the same content.

You can redirect (with a 301) from one to the other so you don't have a non SSL version.

Is there anyway to stop this?

Not really.

The user will almost always hit up the non-ssl version of the site first so is there a script that will wait until the http content is loaded than maybe force a https version into the users cache?

No. It would be a horrible security problem if a URL could precache content for arbitrary other URLs.

Or should i just use absolute paths (https://www.mysite.com/_css/main.css) on ever page and on every css background image (only 2 i use sprites).

That would work, but lead to mixed content issues.

Or do we just live with it?

Yes.