В сгенерированном PDF нет изображения, включенного в шаблон Handlebars
app.get('/individual_report/:athlete_id', function(req, res) {
database.select('*').from('participants').then(data => {
if (data.length) {
res.render('individual_report', {
name: data
});
const hbsfile = fs.readFileSync(__dirname + '/../public/views/individual_report.hbs', 'utf8');
const document = {
template: hbsfile,
context: {
options: {
dataForPDF: data,
ssl_logo: '../public/static/assets/image/white_ssl_logo.png',
},
},
path: __dirname + '/../public/reports/' + data[0].first_name + " " + data[0].last_name + '\'s scores.pdf'
};
pdf.create(document, options).then(res => {
console.log(res)
}).catch(error => {
console.error(error)
});
} else {
res.json({
msg: 'Invalid athlete ID'
});
}
}).catch(err => res.sendStatus(400));
});
Вышеуказанный экспресс-маршрут узла отображает HTML-страницу, а также генерирует PDF-файл с использованием шаблона HandleBars .hbs.
<img class="ssl_logo" src="{{{options.ssl_logo}}}" alt="logo.png" width="120" height="50" />
Это то, что у меня есть в файле.hbs, который должен отображать файл изображения логотипа.
Изображение не отображается в браузере, а также в файле PDF. Однако атрибут alt отображается в браузере и в PDF. Я заглянул в консольный журнал и получил неизвестный атрибут source:
img class = "ssl_logo" src (неизвестно) alt="logo.png" width="120" height="50"
Я использую пакет узла dynamic-html-pdf для создания этого отчета, и кто-нибудь может предложить мне что-то, что могло бы сделать это? Спасибо.
2 ответа
просто попробуйте использовать файловый протокол
ssl_logo: 'file://' + __dirname + '/public/static/assets/image/white_ssl_logo.png',
он будет работать нормально, даже изображения SVG будут сгенерированы
Welp, я собираюсь ответить на свой собственный пост. По какой-то причине этот фрагмент кода не читает локальный файл изображения, поэтому я загрузил изображение на диск Google, получил ссылку общего доступа, как Google изменить ссылку общего доступа, поскольку генерируемая ссылка не будет работать в нашем приложении. код и замените адрес файла изображения ссылкой.
Надеюсь, что это поможет тем, кто имеет или будет иметь эту проблему. (В конечном итоге вы должны решить проблему самостоятельно, haizzzz)