Question

我试图通过SSL正确加载我的网站，每次查看页面时，图标和字体都没有加载。

这就是我用于CSS和字体的真棒。

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.min.css" rel="stylesheet">
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600' rel='stylesheet' type='text/css'>

Here's a link to the website in case you want to check the full code

Answer 1

尝试从href删除http：

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

这里有一篇关于协议相关的好文章：paulirish.com/2010/the-protocol-relative-url/

Answer 2

我在Chrome上遇到了相同的SSL / TLS错误/问题。它在firefox上运行正常。我不得不切换来源。

MaxCDN存在问题，您需要使用KeyCDN。

切换自：

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

为：

<link href="https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css" rel="stylesheet"/>

Answer 3

尝试使用

//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css

也许这是一个使用＆＃34; http＆＃34;的简单问题。相反＆＃34; https＆＃34;因为谷歌apis使用https进行安全链接转移。用https替换http

Answer 4

在我的情况下，将http来源更改为https，而在css file中使用@import语句可以正常工作。

@import url(https://opensource.keycdn.com/fontawesome/4.7.0/font-awesome.min.css);
[class*="fontawesome-"]:before {font-family: 'fontawesome', sans-serif;}

Answer 5

尝试下载真棒字体的zip（css和素材资源），然后从您自己的服务器/目录中提供它们-而不使用CDN链接。

然后仅使用https：//

引用您自己目录中的字体超赞的CSS文件

这对我有用。

Answer 6

我假设您的Web浏览器阻止了从为HTTPS配置的服务器（称为“混合内容”）加载HTTP资源，并被标记为安全风险。

安全站点永远不要通过非安全机制加载资源。

您的网络浏览器可能自动更新为不允许加载混合内容的较新版本。

What is Mixed Content? - Google Developers

Answer 7

我遇到了同样的问题-在尝试使用带有和不带有https://..的CDN链接后，我决定下载真棒字体的zip文件，并改为从我自己的服务器提供它们。

将所有css和assets放置在您自己的服务器上，而不是使用https://..从CDN链接中加载它们

然后，仅使用https：// .. {p>引用font-awesome.css文件。

例如：

<link rel="stylesheet" href="https://yourdomain-name.com/assets/font-awesome-4.7.0/css/font-awesome.min.css">

绕了圈之后，这对我来说是固定的。

字体和字体真棒图标无法通过SSL加载

7 个答案: