2013-06-05 12 views
18

Dlaczego osadzanie czcionek Google nie działa na Heroku?Heroku i Google Fonts

Na przykład:

<link href='http://fonts.googleapis.com/css?family=<some_kinda_font>' rel='stylesheet' type='text/css'> 

EDIT: Okazuje się, że to działa, jeden z moich rozszerzeń Chrome blokuje go jako „niepewnego scenariusza”

Odpowiedz

42

odkryłem że Heroku ustawia parametry zabezpieczeń za pomocą google adres URL czcionek. Chce używać https zamiast zwykłego http. Oto, co sprawdziło się dla mnie.

Zamiast:

@import url('http://fonts.googleapis.com/css?family=Oswald:400,700,300'); 

użyłem

@import url('//fonts.googleapis.com/css?family=Oswald:400,700,300'); 

Jeśli zauważysz druga linia pomija http, dzięki czemu Heroku używać https. Zakładam, że prawdopodobnie użyłbyś https w linku, gdybyś chciał.

+0

dziękuję! człowiek, który pomógł –

12

Wystarczy użyć protokołu HTTPS zamiast HTTP:

<%= stylesheet_link_tag "application", 'https://fonts.googleapis.com/css?family=<font_name>', :media => "all" %> 
+1

To zadziałało dla mnie po wypróbowaniu wszystkiego innego. – j0e

1

Zmień link HTTPS

 
<link href='https://fonts.googleapis.com/css?family=some_kinda_font' rel='stylesheet' type='text/css'> 
2

Lepszym rozwiązaniem jest pozostawienie poza protokół całkowicie i po prostu zacząć od '//'. Prawidłowe Protocol (HTTP lub HTTPS) zostaną wykorzystane w zależności od kontekstu serwera

<link href='//fonts.googleapis.com/css?family=some_kinda_font' 
rel='stylesheet' type='text/css'> 
2

Albo można użyć adresu URL bez określenia protokołu HTTP

<%= stylesheet_link_tag "application", '//fonts.googleapis.com/css?family=<font_name>', :media => "all" %> 

Z tego zarówno HTTP i HTTPS pracy.