我有一个使用facebook插件评论的网站.我正在寻找一种方法在屏幕截图中包含这些评论.如果我使用简单的html2canvas,我会得到一个空白框而不是它们.所以我尝试使用html2canvasproxy但现在它打印一些
javascript控制台日志而不是facebook评论.
它应该像但我得到.我注意到html2canvasproxy.PHP正确保存了facebook插件html.
我在控制台日志中找不到任何javascript错误.
html2canvas(document.body,{
"logging": true,//Enable log (use Web Console for get Errors and Warnings)
"proxy":"js/html2canvasproxy.PHP","onrendered": function(canvas) {
var img = new Image();
img.onload = function() {
img.onload = null;
document.body.appendChild(img);
};
img.onerror = function() {
img.onerror = null;
if(window.console.log) {
window.console.log("Not loaded image from canvas.toDataURL");
} else {
alert("Not loaded image from canvas.toDataURL");
}
};
img.src = canvas.toDataURL("image/png");
}
});
我在html2canvasproxy.PHP中有这个设置：
//Turn off errors because the script already own uses "error_get_last"
error_reporting(0);
//setup
define('JSLOG','console.log'); //Configure alternative function log,eg. console.log,alert,custom_function
define('PATH','../screenshots');//relative folder where the images are saved
define('CCACHE',60 * 5 * 1000);//Limit access-control and cache,define 0/false/null/-1 to not use "http header cache"
define('TIMEOUT',30);//Timeout from load Socket
define('MAX_LOOP',10);//Configure loop limit for redirect (location header)
define('CROSS_DOMAIN',0);//Enable use of "data URI scheme"
//constants
define('EOL',chr(10));
define('WOL',chr(13));
define('GMDATECACHE',gmdate('D,d M Y H:i:s'));
解决方法
我在阅读时得到的第一个想法是包括一些超时 – 等待一段时间(让我们说200毫秒) – 这样你就有更多的机会加载.
但是在插件网站上阅读之后：“该脚本允许您直接在用户浏览器上截取网页或部分网页的”屏幕截图“.截图基于DOM,因此可能不是真实的100％准确表示,因为它不会制作实际的屏幕截图,但会根据页面上提供的信息构建屏幕截图.“它无能为力.
我个人会调查使用另一种解决方案 – 例如PhantomJS：
“PhantomJS是一个带有JavaScript API的无头WebKit脚本.它具有对各种Web标准的快速和原生支持：DOM处理,CSS选择器,JSON,Canvas和SVG.”
这很容易：
var page = require('webpage').create();
page.open('http://github.com/',function() {
page.render('github.png');
phantom.exit();
});
