5

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.

Steve
  • 115
  • 7
  • Please use [example.com](http://www.iana.org/domains/example/) and friends for examples. mysite.com is a real hosting company and don't need fake links pointing at them giving them 404 errors. – Quentin Sep 01 '11 at 16:14
  • fixed...sorry about that – Steve Sep 01 '11 at 16:43

5 Answers5

4

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.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Good point about the security problem, didn't think of that. Well i guess i'll live with it until the internet gods come up with an alternative. Peace. – Steve Sep 01 '11 at 16:41
  • As to the javascript solution I was think along the lines of:http://headjs.com/. Where the javascript overrides default functionality, before loading the styling...something along those lines. Like load http main.css and the rest of the page, then trigger a js code that loads the https version. – Steve Sep 01 '11 at 16:48
1

There are a couple ways to fix this.

  1. Use a base tag. Then use relative paths for your resources and caching will be perceived to work for http and https, though really it was just loaded on https already. Demonstration

    <base href="https://example.com/" />

  2. Redirect everything to SSL when the user hits the site the Apache way (Redirect SSL)

    Redirect permanent / https://example.com/login

Jeff
  • 846
  • 8
  • 13
  • forcing ssl doesn't solve this issue, it still redirects from non ssl version to ssl version giving user a warning! – BigSack Apr 05 '13 at 03:04
  • Actually forcing SSL does solve the issue, http://wiki.apache.org/httpd/RewriteHTTPToHTTPS. But really the tag is what they are looking for. This will cause the page to load the content to load from the https:// version every time, whether everything else is secure or not. Don't know what browser you are using but your warning is an isolated occurrence. – Jeff Apr 20 '13 at 23:23
0

Use protocol-relative paths.

Instead of this

<link rel="stylesheet" href="http://domain.com/style.css">
<link rel="stylesheet" href="https://domain.com/style.css"> 

use this

<link rel="stylesheet" href="//domain.com/style.css">

then it will use the protocol of the parent page.

0

You can use an .htaccess RewriteRule to load the https content every time; or a redirect header specified in the http version of the html would work more slowly (extra round-trip) but otherwise just as well, I believe.

Pete Wilson
  • 8,610
  • 6
  • 39
  • 51
-1

You can reference the files without the protocol specifier, e.g.:

<link rel="stylesheet" type="text/css" href="//mysite.com/_css/main.css" />

See this post for more details:

Can I change all my http:// links to just //?

Community
  • 1
  • 1
Sam Huggill
  • 3,106
  • 3
  • 29
  • 34
  • Those would resolve to the same URIs that are being already used, so that wouldn't change anything. – Quentin Sep 01 '11 at 16:13
  • basically this is already happening. The browser just thinks https main.css is different than http main.css so its technically a different resource, but the contents the same...kinda sux. – Steve Sep 01 '11 at 16:44