Wrong font displayed in PDF when using wkhtmltopdf

3
votes

I am using wkhtmltopdf to print reports that are generated inside a react html page. For all the text, the css has the font set to 'Open Sans', sans-serif inside my html I have the following in my header to load the Open Sans font:

<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

This all seems to work fine when I run wkhtmltopdf on my development machine, and I get output looking like this:

enter image description here

However, on my server (on Azure running as a Azure Web App) I get the following output:

enter image description here

As you can see, all the text looks very pixelated, except for the header that is bold for some reason. If you see both the bold and normal text, you can also see that the Open Sans font is not used (easiest to see on the g's).

So the question is twofold:

  1. Why is not the Open Sans font being used on Azure?
  2. Why is the text pixelated? If I change 'Open Sans', sans-serif to just sans-serif it still looks ok in the browser with the default sans-serif font.

Appreciate all help on this!

EDIT

Some additional information. The local PDF is 23Kb and the server PDF is 207Kb. On the server PDF only the Bold text is selectable, and not the rest, so it seems like the non-bold text is treated as an image, and not actual text.

Also, for the local PDF is says under Fonts OpenSansRegular (Embedded Subset), Type: TrueType (CID), Encoding:Identity-H that seems reasonable. However, under the server/Azure PDF it says under Fonts ArialBold (Embedded Subset), Type: TrueType (CID), Encoding:Identity-H.

So for some reason the wrong font is getting embedded, and the non-bold text is treated as an image.

1
fontsazure-web-app-servicewkhtmltopdf
It seems that the font is not installed or the sandbox restricts in the Azure WebApp and load the defaults to Aria. I also find a smilar issue. We also can give our feedback to Azure team. - Tom Sun - MSFT
Do you have any update about this thread? - Tom Sun - MSFT

1 Answers

0
votes

According to document we could know that wkhtmltopdf is not supported on the Azure WebApp currently. And Azure team are working on it.The following is snippet from the document.

PDF generation from HTML

There are multiple libraries used to convert HTML to PDF. Many Windows/.NET specific versions leverage IE APIs and therefore leverage User32/GDI32 extensively. These APIs are largely blocked in the sandbox (regardless of plan) and therefore these frameworks do not work in the sandbox.

There are some frameworks that do not leverage User32/GDI32 extensively (wkhtmltopdf, for example) and we are working on enabling these in Basic+ the same way we enabled SQL Reporting.