Google Web Fonts su pagine HTTPS su Chrome

Question

Sto lavorando a un progetto di ecommerce. Parti del sito sono HTTP per impostazione predefinita. Altri, come la pagina di checkout, sono HTTPS per impostazione predefinita. Sulle pagine HTTPS sto ottenendo questo messaggio sulla console su Chrome:

[blocked] The page at https://store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22 ran insecure content from http://fonts.googleapis.com/css?family=PT+Sans. 
[blocked] The page at https://store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22 ran insecure content from http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,700. 
[blocked] The page at https://store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22 ran insecure content from http://fonts.googleapis.com/css?family=Patua+One. 

I font sono legati sulla testa del documento in questo modo:

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'> 
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,700' rel='stylesheet' type='text/css'> 
<link href='http://fonts.googleapis.com/css?family=Patua+One' rel='stylesheet' type='text/css'> 

sembra ok su altri browser che ho testato finora.

Answer 1

creare uno schema URL agnostica

Change http://fonts.google...-//fonts.google...

goccia la http: o https: dalla parte anteriore, il browser utilizzare qualsiasi schema si sta attualmente utilizzando sul sito.

Puoi richiedere risorse utilizzando https da http, ma non il contrario modo. Un'alternativa alla soluzione di cui sopra (e probabilmente best practice) è quella di usare sempre lo https se disponibile (che deve essere se si utilizza questo stile di collegamento, altrimenti non vi è alcun punto in esso comunque).

Answer 2

rimuovere il protocollo dal tuo URL e lasciare il browser determinarla:

<link href="//fonts.googleapis.com/css?family=PT+Sans" ... 

Se la pagina è HTTPS, il font verrà caricato dal URL HTTPS. Se la pagina è HTTP, verrà caricata dall'URL HTTP.