Chrome on Chromebook Fails to Load Styles From CDN

Question

I have an HTML page which references a number of stylesheets. Most of the stylesheets are "local" to the website. I have one stylesheet, however, that I reference from a CDN. It's the Font-Awesome css file. My reference is as follows:

<link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" />

I reference the styles from this css file in several places across my application and an example reference is:

<span class="fa fa-pencil cursor-pointer margin-left-5" ng-click=\'openRoomEdit(dataItem)\'></span>

These references work fine everywhere except on Chromebooks. I have tested it on Edge, Firefox and Chrome on Windows and Safari and Chrome on Macs. It works on every single one of those of those examples. However, on Chromebooks, it can't find the styles from that CSS and so the icons do not render.

On Chromebooks only, I'm getting a net::ERR_INSECURE_RESPONSE in the Network panel when it tries to load the CSS file from the CDN. I'm referencing the file using https, from an app that runs as https with a valid SSL cert.

When I install the Font-Awesome files local to the application and reference it that way, everything works fine. I would prefer to be able to reference it via a CDN, but since many of my clients use Chromebooks, I need to figure out why this doesn't work.

Answer 1

To be sure the issue does not rely in the specific SSL BootstrapCDN is using, you should try using this one instead has a first step.

https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css

cdnjs and BoostrapCDN are both using SHA-256, but BootstrapCDN is using a Symantec that has been generated on October 2016 and it makes me think of this bug in Chrome 53 where Symantec certificates were automatically rejected. I dunno if you can control the versions of Chrome your clients and you are using, but it might be a lead if they are not up-to-date.

Also what kind of certificate are you using for you own website? Is it trusted? It not, you can use LetsEncrypt to create one trusted by most CAs. There has been issues in the past about self-signed certificates and Chrome you can find at tickets #516808 and #516808.

If nothing helps, you may want to do a NetLog dump so we have more info about your issue.