Différence de rendu PDF avec wkhtmltopdf entre environnement local et production (Rails, Wicked_PDF)

Il m’est arrivé une mésaventure en polissant une fonctionnalité. Je devais réaliser un document PDF en pixel perfect :
– dans l’environnement de développement, le document est prêt, le résultat attendu est obtenu
– passage en pré-production, environnement pourtant réputé identique à la production, le problème présenté ci-dessous survient

À gauche, le rendu wkhtmltopdf sous Ubuntu Server 12.04.
À droite, le rendu sous Ubuntu Desktop 18.04.

Une font est appliquée en CSS sur le texte, la très classique sans-serif. Comment expliquer une telle différence ? La police semble pourtant bien être la même… à quelques exceptions près (observez attentivement le « 1 »). Tirons ça au clair :

$ fc-match sans-serif
DejaVuSans.ttf: "DejaVu Sans" "Book"

Cette commande retourne quelle police sur votre système correspond au mieux. Les deux machines m’ont retourné le même résultat. Sous Ubuntu les fonts sont stockées dans /usr/share/fonts/, et il apparaît que DejaVu date de 2011 d’un côté et de 2016 de l’autre. Il est donc simple de vérifier via un scp si l’évolution de DejaVu explique à elle seule le problème : il s’avère que non.

Côté Wicked_PDF, j’ai essayé de modifier le zoom ou les DPI du document, mais l’écart entre l’environnement local et l’environnement distant était conservé.

J’ai trouvé ici et les traces d’un bug Webkit concernant l’utilisation de polices non-OTF. La solution semble de convertir la police TTF au format OTF. Ça semble incroyable, mais cela a fixé la différence de rendu.

Il existe un tas de convertisseurs de polices TTF vers OTF en ligne qu’on peut trouver sur Google. Une fois convertie, que faire de la police ? Vous pourriez replacer la font dans /usr/share/fonts/ sur les deux environnements, le plus sage reste de l’emporter dans votre projet, cela évitera à un autre développeur de rencontrer la même tuile.

Voici le bout de code à ajouter dans votre fichier CSS :

@font-face {
  font-family: "fixFont";
  src: url('file://<%= Rails.root.join("public", "fonts", "DejaVuSans.otf") %>'), /* Chemin absolu pour le fichier HTML tampon généré par Wicked côté serveur */
       url('/fonts/DejaVuSans.otf'); /* Pour afficher le HTML coté navigateur */
}

L’utilisation de la dernière version en date de wkhtmltopdf (0.12.4) n’a pas résolu ce problème, bien qu’elle semble uniformiser d’autres problèmes de rendus entre différents systèmes d’exploitation.

Laisser un commentaire