Как изменить размер бумаги в безголовом Chrome -print-to-pdf

Я использую headless Chrome для экспорта html-документов в pdf

google-chrome --headless --disable-gpu --print-to-pdf='output_path' 'url'

Как изменить размер бумаги в формате pdf?

У меня есть контроль над параметрами Chrome и html.

Я всегда получаю Письмо США.

Для этого нет документальных параметров командной строки.

Я попытался установить CSS: @page {size: A4;}. Не работает в режиме без звука, но работает, когда я ударяю Ctrl + P в нормальном режиме (опция для выбора формата бумаги для Save as pdf исчезает, экспортированный PDF имеет размер страницы A4).

Я пробовал это в версиях 59, 60 и 61 Chrome на Ubuntu 16.04.

Ответ 1

Вы можете запустить безголовочный хром из среды Node.

Затем вы сможете передать дополнительные параметры printToPdf функция, включая pageWidth и pageHeight.

Ответ 2

Примечание: после просмотра комментариев в ответе на atomrc я подумал о том, чтобы добавить это в качестве ответа, чтобы быть более понятным.

Вы не можете изменить размер страницы прямо сейчас, если не используете протокол devtools.

Это ошибка в безголовом Chrome. @page size CSS @page size неправильно понимается в режиме без @page size, поскольку этот пользователь хорошо описывает его на трекере ошибок хрома:

Desktop Chrome поддерживает @page at-rules для размера и полей и устанавливает размеры листа в соответствии со свойством size.

Похоже, что Headless Chrome также в некоторой степени анализирует @page, но ведет себя не так, как версия для настольного компьютера: если вы укажете @page {size}, кажется, что безголовый изменит размеры окна страницы (по сути, области печати), а не лист, который всегда остается размером с букву США. Однако он поворачивает лист, если вы укажете {size: landscape}.

Ответ 3

Был создан патч, созданный когда-то, что позволяет настроить размер страницы https://codereview.chromium.org/2829973002/

Теперь он закрыт и доступен в неустойчивой версии хром, поэтому вы можете использовать его, как вы предложили @page { size: A4 }.

Я тестировал, он работает с нестабильной сборкой, которую я установил (Google Chrome 61.0.3141.7 dev). Я не уверен, однако, как проверить, когда он будет доступен в стабильной сборке...

Ответ 4

Размер страницы может быть установлен в дюймах/мм. Я не тестировал с размером в пикселях. Вот набор правил CSS, которые помогли мне:

@page {
  margin: 0;
  padding: 0;
  size: 5in 6.5in;
}

Мой точный случай - рендеринг svg-to-pdf, а не html; Для svg вам также может понадобиться добавить атрибуты width и height в <svg>:

<svg width="5in" height="6.5in" ...>

Все это! Выходной PDF не будет иметь полей и сохранит нужный размер - 5 "x6,5" в моем случае.

Ответ 5

Размер страницы теперь, по-видимому, можно "почти" точно контролировать без использования интерфейса отладки.

Ниже приведен метод создания PDF с почти точными размерами его содержимого с использованием безголового хрома.

<head>
    <style>
      html, body {
        width:  fit-content;
        height: fit-content;
        margin:  0px;
        padding: 0px;
      }
     </style>

     <style id=page_style>
      @page { size: 100px 100px ; margin : 0px }
     </style>

</head>

Это подготавливает PDF файл к размеру страницы, но он не будет правильным, поскольку для размера страницы установлено произвольное значение 100x100.

После того, как документ отрендерен, для правильной установки размера страницы внизу страницы используется следующее:

<script>
window.onload(fixpage);

function fixpage() {

     renderBlock = document.getElementsByTagName("html")[0];
     renderBlockInfo = window.getComputedStyle(renderBlock)

     // fix chrome page bug
     fixHeight = parseInt(renderBlockInfo.height) + 1 + "px"   

     pageCss = '@page { size: \${renderBlockInfo.width} \${fixHeight} ; margin:0;}'
     document.getElementById("page_style").innerHTML = pageCss
}
</script>

Этот подход устраняет верхний и нижний колонтитулы и имеет дело с числовой проблемой с преобразованием пикселей в pdf.

Еще кое-что

В Chrome в настоящее время есть ошибка с вычислением абсолютной высоты div при использовании CSS

line-height: normal;

Это сделает расчет страницы слишком коротким и приведет к созданию дополнительной страницы в формате PDF. Вы можете исправить это используя:

line-height: unset;

На протяжении всего вашего CSS. Вы не получите точную высоту без этого!