1

I have a secure (HTTPS) web app which needs to load a custom stylesheet from an insecure (HTTP) origin (customer's own website). This is blocked by modern browsers, however I need a workaround because:

1) I cannot ask my customers to host their custom stylesheets on HTTPS. They don't have the know-how and some of them have policies about what hosts and regions stuff can be hosted in (ironically, not about HTTPS though). 2) I obviously cannot ask the end user to disable security features in their browser.

I tried, loading stylesheets using <style>@import url(...);</style>, I tried creating an iframe with src="about:blank" and loading the stylesheet from within there, I tried XHR and fetch (but that will require CORS to be enabled on the remote host which I cannot reasonably expect).

Short of creating a secure proxy that will serve any stylesheet on the web, is there any other workaround I'm missing here?

Any sorcery to get my page to load a cross-origin stylesheet over HTTP?

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
sstur
  • 1,769
  • 17
  • 22

3 Answers3

1

If there was a workaround to be able to load insecure resources on secure pages, it should be patched ASAP. No, the policy exists because without HTTPS on all resources, you're not truly secured. Any HTTP connection may be intercepted and man-in-the-middled, so the page is not secure. Even something minor like a stylesheet can undermine that security.

You will have to serve the stylesheet over HTTPS, and if your customers can't do it, you will have to do it for them.

deceze
  • 510,633
  • 85
  • 743
  • 889
  • "If there was a workaround to be able to load insecure resources on secure pages, it should be patched ASAP" That makes sense. However, we can *explicitly* load insecure resources using XHR, even cross-domain. The policy exists (if I understand correctly) to prevent *inadvertently* loading insecure resources by using a stylesheet/script tag that can fall victim to MITM. This is a good policy. I've seen cases where the ISP injects JS into a page to show ads. But policies should set secure defaults yet allow the dev to override things for special cases. This is what I mean about a workaround. – sstur Mar 28 '16 at 23:22
0

Is it perhaps possible to download their CSS server-side, and serve it to your own users via HTTPS?

Steven Lemmens
  • 620
  • 5
  • 18
0

I tried to do the same thing with a webapp that i builded. The real issue with what you want to do is the browser. It doesnt allow a secure connection to be spoiled by an insecure connection, especially when you want to inject something on that page. I used this technic: 

document.createElement("link")

to inject. And with browser security being a big issue, I don't think you'll find a hack.. Best of luck! :)

miqueloi
  • 688
  • 4
  • 13