Differences between Mac and Linux on rendering pdf file

[milotiger]

Hi there,

Thanks for creating this awesome package and it is working almost perfectly. Just one issue... With the same code and option, I got 2 different file sizes

• On MacOS, the size was 167KB
• On Linux (I am using this image https://hub.docker.com/layers/node/library/node/10.14.2/images/sha256-5af431757f84bf7878ff72447eb993fc37afcd975874fff13278157bf83661e6), the file size was 4.8MB

And the interesting thing was the text is selectable on the file exported on MacOs while the file exported on Linux isn't Overall: the file that was exported on MacOs is way better and faster to load than the one on Linux

My code looked like

return new Promise((resolve, reject) => {
    const options = { format: 'A3', type: 'pdf' };
    console.log({ options });
    pdf.create(htmlData, options)
      .toFile(`itinerary_${transactionId}.pdf`, (error, result) => {
        if (error) {
          return reject(error)
        }
        console.log({ options });
        return resolve(result);
      });
  });

Please help, thanks a lot 🌹

[isaaczafuta]

@milotiger I was seeing the same symptoms when using webfonts--it was working on macos but rendering as an image on linux. Any luck if you remove the font?

[milotiger]

@milotiger I was seeing the same symptoms when using webfonts--it was working on macos but rendering as an image on linux. Any luck if you remove the font?

Thanks it works! But we really need to use the font :( I have tried to use the local fonts or event encoded them to base64 string and insert directly to the HTML file. It did load the font to the pdf file but it was still in image format :((

[Tobska]

I encountered this with linking the Roboto font from the embed <link href... from Google fonts since that embed link redirects to a css file that uses .woff fonts.

I decided to download the .ttf (TrueType) versions of Roboto and just used that instead. I used Lambda functions (which uses Linux) for this and redirected the fonts folder to my own folder by following the instructions from this link: https://forums.aws.amazon.com/thread.jspa?messageID=776307 which I got from this issue. I placed the .ttf fonts in that folder and now the text still uses Roboto but it is highlightable now and it doesn't display as an image.

However, I'm just not sure if you can recreate this outside an AWS Lambda function. Maybe the discussion in this issue can be useful as well.

[kmilo8346]

I found a workaround installing the font in the docker container where my service is living. Phantom js load the system installed font without problems. The font can be selected and the pdf size remains the same.

Look that https://tkacz.pro/phantom-js-use-custom-fonts-in-html-to-pdf-convert

// DockerFile ... RUN wget "https://fonts.google.com/download?family=Oxygen" -O font.zip RUN unzip font.zip -d /usr/share/fonts/oxygen ...

// entrypoint ... fc-cache -fv /usr/share/fonts/oxygen ...

// css file ... body { font-family: 'Oxygen', sans-serif; font-size: 14px; } ...