我遇到了PhantomJS的问题,将C#MVC视图的快照制作成pdf。
目前,当代码运行时,我调用PhantomJS C#包装器并将其指向一个视图,该视图会生成并且PhantomJS会执行任何操作并将其转换为PDF文件。那很好,花花公子。
但是,当我查看PDF文件时,我看到了这一点:
如您所见,“反馈报告目录”位于页眉中。理想情况下,最好是标头在DOM中拥有自己的空间,其他所有内容都会被推下来。
这是我必须修改的rasterize.js文件:
"use strict";
var page = require('webpage').create(),
system = require('system'),
address, output, size, pageWidth, pageHeight, fullName;
if (system.args.length < 3 || system.args.length > 5) {
phantom.exit(1);
} else {
address = system.args[1];
output = system.args[2];
fullName = system.args[3];
page.viewportSize = { width: 1140, height: 1000 };
page.paperSize =
{
height: '11in',
width: '8.5in',
margin: {
top: '20px',
bottom: '20px',
left: '10px',
right: '10px'
},
header: {
height: '20px',
contents: phantom.callback(function () {
return "<div style='border-bottom: 1px solid #808080; margin-top: -10px;'>" +
"<span style='color: #808080; font-size: 12px;'>Virtual Competency Assessment - Feedback Report</span><br />" +
"<span style='color: #808080; font-size: 12px;'>" + "John Doe" + " - " + GetDate() + "</span>" +
"</div>";
})
},
footer: {
height: '20px',
contents: phantom.callback(function (pageNum, numPages) {
return "<div style='text-align: center;'>" +
"<span style='color: #808080; font-size: 15px; font-family: Arial;'>" +
"Page <strong>" + pageNum + "</strong> of <strong>" + numPages + "</strong>" +
"</span>" +
"</div>";
})
}
};
page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load the address!');
phantom.exit(1);
} else {
window.setTimeout(function () {
page.render(output);
phantom.exit();
}, 200);
}
});
}
var GetDate = function () {
var today = new Date();
return (today.getMonth() + 1) + "/" + today.getDate() + "/" + today.getFullYear();
}
任何帮助将不胜感激。 非常感谢你的时间。
杰森