Wicked PDF + Fonts + heroku + rails3.2

Question

Ich verwende wicked_pdf mit Rails 3.2.11 und Ruby 1.9.3, um eine PDF aus HTML zu generieren und zu Heroku bereitzustellen.

Mein pdf.css.scss.erb:

<% app_fullhost = Constants["app_fullhost"] %> 

@font-face { 
    font-family:'DosisMedium'; font-style:normal; font-weight:500; 
    src: url(<%=app_fullhost%>/app/font/dosis/Dosis-Medium.ttf) format('woff'); 
} 

*, body { 
    font-family: "DosisLight", 'Times New Roman', 'Arial', sans-serif; 
} 

wo app_fullhost die genaue Host ist, in der Entwicklung oder Produktion.

Mein pdf Layout umfasst unter anderem:

%html{:lang => I18n.locale} 
    %head 
    %meta{:charset => "utf-8"} 
    %title= content_for?(:title) ? yield(:title) : Settings.app_name 
    = wicked_pdf_stylesheet_link_tag "pdf" 

In production.rb habe ich

config.assets.precompile +=%w(pdf.css) 

Dies ohne Probleme in der Entwicklung funktioniert, aber auf Heroku die PDF-Datei nicht geladen die gewünschte Schrift

config.assets.paths << "#{Rails.root}/app/assets/fonts" 
config.assets.precompile += %w(*.svg *.eot *.woff *.ttf) 
config.assets.precompile += %w(.svg .eot .woff .ttf) 

und ich habe auch versucht, zu ändern (in pdf.css.scss.erb):

@font-face { 
    font-family:'Dosis'; font-style:normal; font-weight:500; 
    src: url('Dosis-Medium.ttf') format('woff'); 
} 

oder

@font-face { 
    font-family:'Dosis'; font-style:normal; font-weight:500; 
    src: url(<%= asset_path('Dosis-Medium.ttf')%>) format('woff'); 
} 

Ich habe auch verschiedene Lösungen wie das Hinzufügen dieser in production.rb versucht

Die Schriften sind in assets/fonts und auch in public/app/font/dosis und uRL auf Heroku reagieren richtig mit:

..//myapp/app/font/dosis/Dosis-Medium.ttf" and 
..//myapp/assets/Dosis-Medium.ttf 

Wie kann ich die Schrift auf Heroku laden?

Answer 1

Lassen Sie mich sehen, ob ich dieses Recht haben:

Server 1: ein PDF erstellen, braucht Schriftarten und zieht sie von einer URL Diese lokal in dev funktioniert, aber nicht auf Heroku.

Gibt es etwas in den Protokollen? (sehen Sie die HTTP-Anfrage für die Schriftart?)

Sie sagten, es lädt nicht die richtige Schriftart. Sprengt es, oder rendert es nur so, als hätte es nie die Schriftart geladen (zB eine 404 beim Font-Fetch).

Funktioniert das, wenn Sie nicht die Schriftartdatei von heroku ziehen? (wie aws oder eine andere Schriftart von einer anderen URL nur als Test verwenden)

Ziehen Sie aus dem gleichen Server-Prozess, der gerade ausgeführt wird? Verfügen Sie über mehr als einen Prüfpunkt oder mehr als einen Einhornprozess, der den aktuellen Prozess (PDF-Erstellung) und die eingehende Anforderung verarbeiten kann?

Ich habe Leute gesehen, die nur einen Prüfstand ausführen Versuchen Sie jedoch, zwei HTTP-Ereignisse auszuführen und Probleme zu beheben. Wenn du nur einen Dyno hast (du hast das nicht erwähnt), füge noch einen hinzu und schau was passiert, oder füge einen weiteren Einhornprozess hinzu.

Answer 2

wkhtmltopdf, das zugrunde liegende Programm wicked_pdf, ist notorisch funky, wenn es um das Laden von Schriftarten über CSS kommt. Auf einigen Systemen arbeitet es mit absoluten Pfaden, manchmal erfordert es relative Pfade. Selbst wenn Sie die Pfade korrekt erhalten, kann es durch ungenaue CSS-Verzögerung usw. abgeworfen werden. Es gibt Dutzende von Fragen, die sich nur auf SO beziehen.

Die beste, flexibelste und tragbare soltion die ich gefunden habe, um Base64-codieren ist die Schriftart, die Sie zu verwenden, sind versucht, und es sind direkt in der CSS-Datei:

@font-face { 
    font-family: 'OpenSans'; 
    src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQA... 
} 

Answer 3

Ich lief in dieses Problem und folgte dem Rat von Arman H - Ich konvertierte die Schriftart zu Base 64 und referenzierte es direkt in der CSS/SCSS-Datei. Die weiteren Schritte, denen ich folgte, sind denen in der ursprünglichen Frage sehr ähnlich.

habe ich eine vollständige Beschreibung zusammen (mit einem Github Link zum Quellcode) hier: http://apleroy.com/posts/custom-pdf-fonts-with-wicked_pdf-and-heroku

Zuerst verweisen ich die Schrift im Font-Verzeichnis.

<%# /fonts/custom_fonts.css.scss.erb %> 
@font-face { 
    font-family: "SourceSansPro-Light"; 
    src: url('<%= asset_path("SourceSansPro-Light.otf") %>'); 
} 

, dann 64 kodieren eine Schrift zu stützen, habe ich diese Website (bereits in einem Kommentar oben gerichtet): http://www.opinionatedgeek.com/dotnet/tools/base64encode/. Die Base-64-codierte Ausgabe ist eine zufällige Zeichenfolge, die aus mehreren hundert Zeilen alphanumerischer Zeichen besteht. Ich kopierte diese Ausgabe in die neue pdf.css.scss Datei:

<%# /stylesheets/pdf.css.scss %> 
@font-face { 
    font-family: 'Source Sans Pro Light'; 
    src: url(data:font/truetype;charset=utf-8;base64,T1RUTw-----THIS IS HUNDREDS OF LINES LONG -------sGAnBSvO7nBqXQ==) 
} 

Innerhalb der eigentlichen HTML-Seite (die in PDF konvertiert wird) Ich beziehen den wicked_pdf Sheet-Tag - wie in der ursprünglichen Frage gerichtet:

<%# views/pdf_pages/show.html.erb %> 
<meta charset='utf-8' /> 
<%= wicked_pdf_stylesheet_link_tag "pdf" %> 

Schließlich vorkompilierte ich das pdf Sheet so wie es in der Asset-Pipeline für den Einsatz auf Heroku enthalten:

#application.rb 
config.assets.precompile += ['pdf.css']