2010-05-21 7 views
6

Ich versuche, eine Offline-HTML5-Testanwendung zu erstellen, und spiele mit der neuen Google Fonts API gleichzeitig. Hat jemand irgendwelche Ideen, wie man die Remote-Schriften zwischenspeichert? Einfach den API-Aufruf in das Cache-Manifest zu stellen funktioniert nicht, ich nehme an, dies liegt daran, dass die API tatsächlich andere Dateien lädt (ttf, eot, etc).HTML5 Offline-Cache google font api

Irgendwelche Ideen, wenn Sie die Schriftart api offline verwenden würden möglich?

Als Referenz ist dies der Anruf ich, damit ich bin:

http://fonts.googleapis.com/css?family=IM+Fell+English|Molengo|Reenie+Beanie 

Antwort

5

Wenn Sie fügen die URL in die Adressleiste des Browsers Sie die Dateien in die CSS-Links sehen werden:

http://themes.googleusercontent.com/font?kit=txVk61PTIsDrQQj2fK-76Q 
http://themes.googleusercontent.com/font?kit=ljpKc6CdXusL1cnGUSamX_cCQibwlboQP4eCflnqtq0 
http://themes.googleusercontent.com/font?kit=xwIisCqGFi8pff-oa9uSVOj-KzHqS7w8OFmqoAXdQwE 
+3

Aber du musst vorsichtig sein. Google gibt Ihnen verschiedene Schriftartdateien, abhängig von dem Betriebssystem, von dem Sie es anfordern. So sollten Sie alle Schriftartdateien für alle Betriebssysteme –

+1

tatsächlich hinzufügen. Eine Möglichkeit, alle Dateierweiterungen zwischenzuspeichern, wird in dieser stackoverflow-Frage beschrieben: http://stackoverflow.com/questions/7042834/is-it-possible-to-load-webfonts-through-the-offline-storage-cache-manifest –

6

RobertC des Ansatz ist die Lösung ...

Dh, fügen Sie die Google-bereitgestellten Link in Ihren Browser, und fügen Sie dann alle Dateien, die in Ihrem Manifest verwiesen werden.

In meinem Fall verweisen ich

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

, die gerade von der folgenden Stildefinition besteht

@font-face { 
    font-family: 'Patua One'; 
    font-style: normal; 
    font-weight: 400; 
    src: local('Patua One'), local('PatuaOne-Regular'), url('http://themes.googleusercontent.com/static/fonts/patuaone/v3/yAXhog6uK3bd3OwBILv_SD8E0i7KZn-EPnyo3HZu7kw.woff') format('woff'); 
} 

So die Schriftart zu erhalten, wenn zwischengespeichert zu arbeiten (off-line oder nicht), haben Sie um die URL, auf die im 'src' verwiesen wird, zu Ihrem Manifest hinzuzufügen.