Chrome上的HTTPS页面上的Google Web字体 [英] Google Web Fonts on HTTPS pages on Chrome

问题描述

我正在做一个电子商务项目。该网站的部分默认为HTTP。其他（如结帐页面）默认为HTTPS。在HTTPS页面上，我在Chrome上的控制台上看到这条消息：

  [blocked] https：// store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22从http://fonts.googleapis.com/css?family=PT+Sans中运行不安全的内容。 
 [blocked] https://store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22中的网页从http://fonts.googleapis.com/css?family=Open+Sans中运行不安全的内容：400italic，400300700。 
 [已阻止] https://store-ws3q9h.mybigcommerce.com/checkout.php?tk=c99fa39e007db6376dcddaac68695c22中的网页从http://fonts.googleapis.com/css?family=Patua+One运行不安全内容。 
  

字体以这种方式链接在文档头上：

 < 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'> 
  

到目前为止我测试过的其他浏览器看起来还不错。

解决方案

创建模式不可知的url

< p>

从前面删除 http：或 https：浏览器将使用您当前在网站上使用的任何模式。

您可以使用 https 从 http ，而不是其他的
方式。上面的解决方案（也许是最好的做法）的另一种方法是只要总是使用
https （如果你使用的是这种风格
的链接，否则无论如何没有任何意义）。

I'm working on an ecommmerce project. Parts of the site are HTTP by default. Others, such as the checkout page, are HTTPS by default. On the HTTPS pages I'm getting this message on the console on 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.

The fonts are linked on the document head in this way:

<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'>

It looks ok on other browsers I have tested so far.

解决方案

Create a schema agnostic url

Change http://fonts.google... to //fonts.google...

Drop the http: or https: from the front, the browser will use whichever schema you're currently using on the site.

You may request resources using https from http, but not the other way round. An alternative to the above solution (and probably best practice) is to just always use https if it's available (which it must be if you're using this style of link, otherwise there no point in it anyway).

这篇关于Chrome上的HTTPS页面上的Google Web字体的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！