Я хочу создать печатную версию веб-страниц веб-сайта pdf. Что-то вроде express.render() отображает только страницу pdf
Кто-нибудь знает модуль node, который делает это?
Если нет, как бы вы это сделали? Я видел, как некоторые методы говорят об использовании браузера без браузера, например phantom.js, но не уверены, что такое поток.
Продолжая ответ Мустафы.
A) Установите http://phantomjs.org/, а затем
B) установите модуль phantom node https://github.com/amir20/phantomjs-node
C) Вот пример рендеринга pdf
var phantom = require('phantom');
phantom.create().then(function(ph) {
ph.createPage().then(function(page) {
page.open("http://www.google.com").then(function(status) {
page.render('google.pdf').then(function() {
console.log('Page Rendered');
ph.exit();
});
});
});
});
Вывод PDF:
EDIT: Тихая печать в формате PDF
java -jar pdfbox-app-2.0.2.jar PrintPDF -silentPrint C:\print_mypdf.pdf
Phantom.js - это безгласный веб-сервер, и он загрузит любую веб-страницу и отобразит ее в памяти, хотя вы, возможно, не будете возможность увидеть его, есть функция Screen Capture, в которой вы можете экспортировать текущее представление в формате PNG, PDF, JPEG и GIF. Взгляните на этот пример из phantom.js документации
Если вы хотите экспортировать HTML в PDF. У вас много вариантов. без node даже
Вариант 1: нажмите кнопку на странице html, которая вызывает функцию window.print(). используйте браузерский родной html для pdf. используйте медиа-запросы, чтобы ваша html-страница выглядела хорошо на pdf. и у вас также есть печать до и после событий, которые вы можете использовать для внесения изменений на страницу перед печатью.
Вариант 2. htmltocanvas или rasterizeHTML. конвертируйте html в холст, затем вызовите toDataURL() на объект canvas, чтобы получить изображение. и используйте библиотеку JavaScript, например jsPDF, чтобы добавить это изображение в файл PDF. Недостатком этого подхода является то, что pdf не становится редактируемым. Если вам нужны данные, извлеченные из PDF, для этого есть разные способы.
Вариант 3. @Джозжард ответ
Лучшее решение, которое я нашел, это html-pdf. Это просто и работать с большим HTML.
https://www.npmjs.com/package/html-pdf
Это так просто:
pdf.create(htm, options).toFile('./pdfname.pdf', function(err, res) {
if (err) {
console.log(err);
}
});
Создать PDF из внешнего URL
Здесь приведена адаптация предыдущих ответов, использующая html-pdf, но также сочетающая ее с requestify, поэтому она работает с внешним URL-адресом:
Установите свои зависимости
npm i -S html-pdf requestify
Затем создайте script:
//MakePDF.js
var pdf = require('html-pdf');
var requestify = require('requestify');
var externalURL= 'http://www.google.com';
requestify.get(externalURL).then(function (response) {
// Get the raw HTML response body
var html = response.body;
var config = {format: 'A4'}; // or format: 'letter' - see https://github.com/marcbachmann/node-html-pdf#options
// Create the PDF
pdf.create(html, config).toFile('pathtooutput/generated.pdf', function (err, res) {
if (err) return console.log(err);
console.log(res); // { filename: '/pathtooutput/generated.pdf' }
});
});
Затем вы просто запускаете из командной строки:
node MakePDF.js
Наблюдайте за своим прекрасным пиксельным идеальным PDF файлом для вас (бесплатно!)
Попробуйте использовать Puppeteer для создания PDF из HTML
Пример отсюда https://github.com/chuongtrh/html_to_pdf
пакет
Я использовал html-pdf
Прост в использовании и позволяет не только сохранять pdf в виде файла, но и передавать содержимое pdf в WriteStream (чтобы я мог передавать его непосредственно в Google Storage, чтобы сохранять там свои отчеты).
Использование изображений css +
Он принимает во внимание CSS. Единственная проблема, с которой я столкнулся - это игнорирование моих изображений. Я нашел решение заменить URL в значении атрибута src на base64, например:
<img src="data:image/png;base64,iVBOR...kSuQmCC">
Вы можете сделать это с помощью своего кода или использовать один из онлайн-конвертеров, например, https://www.base64-image.de/
Скомпилируйте действительный HTML-код из HTML-фрагмента + CSS
html документа (я только что применил метод .html() к селектору jQuery).css. Используя эти два значения (хранящиеся в переменных html и css соответственно), я скомпилировал правильный HTML-код, используя строку шаблона
var htmlContent = '
<!DOCTYPE html>
<html>
<head>
<style>
${css}
</style>
</head>
<body id=direct-sellers-bill>
${html}
</body>
</html>'
и передал его для create метода html-pdf.
Для тех, кто не хочет устанавливать PhantomJS вместе с экземпляром Chrome/Firefox на свой сервер - или потому, что проект PhantomJS в настоящее время приостановлен, здесь альтернатива.
Вы можете преобразовать преобразования в API для выполнения этой работы. Многие существуют и меняются, но вы получите надежный сервис с современными функциями (я думаю, CSS3, веб-шрифты, SVG, Canvas-совместимые).
Например, с PDFShift (отказ от ответственности, я основатель), вы можете сделать это просто с помощью пакета request:
const request = require('request')
request.post(
'https://api.pdfshift.io/v2/convert/',
{
'auth': {'user': 'your_api_key'},
'json': {'source': 'https://www.google.com'},
'encoding': null
},
(error, response, body) => {
if (response === undefined) {
return reject({'message': 'Invalid response from the server.', 'code': 0, 'response': response})
}
if (response.statusCode == 200) {
// Do what you want with 'body', that contains the binary PDF
// Like returning it to the client - or saving it as a file locally or on AWS S3
return True
}
// Handle any errors that might have occured
}
);
Используйте html-pdf
var fs = require('fs');
var pdf = require('html-pdf');
var html = fs.readFileSync('./test/businesscard.html', 'utf8');
var options = { format: 'Letter' };
pdf.create(html, options).toFile('./businesscard.pdf', function(err, res) {
if (err) return console.log(err);
console.log(res); // { filename: '/app/businesscard.pdf' }
});
Мы с коллегой сделали экспресс-шаблон в PDF
который позволяет вам генерировать PDF из любых шаблонов, которые вы используете в Express - Pug, Nunjucks, что угодно.
Это зависит от html-pdf и написано для использования в ваших маршрутах так же, как вы используете res.render:
const pdfRenderer = require('@ministryofjustice/express-template-to-pdf')
app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'pug')
app.use(pdfRenderer())
Если вы использовали res.render, то его использование должно выглядеть очевидным:
app.use('/pdf', (req, res) => {
res.renderPDF('helloWorld', { message: 'Hello World!' });
})
Вы можете передать параметры в html-pdf для управления размером страницы документа PDF и т.д.
Просто опираясь на отличную работу других.