javascript - 如何使用 beforeunload 事件使用 html2canvas 截取页面

Question

我正在尝试捕捉页面并将其 canvas.toDataURL 结果发布到外部服务器。一切都很好，但我需要在访问者离开页面之前截屏（通常是在提交表单之后）。我所做的是使用 JQ为beforeunload事件添加一个处理程序，如下所示：

$(window).bind('beforeunload', function(){
    html2canvas(document.body, {async: true, logging: true}).then(function(canvas){
        var data = canvas.toDataURL('image/png', 0.5);

        $.ajax({
            type: 'POST',
            url: 'apiurl.php',
            data: {"screenshot":data},
            success: function(){},
            async:true
        });
    });
});

问题是html2canvas是异步的，它的 async 标志，无论设置为 true 还是 false，都不会改变它的行为。似乎没有一种原生方式可以让html2canvas同步截屏。所以页面不会等待它执行，只是让访问者离开，因此其中的html2canvas和$.ajax没有机会正确完成。

而且即使我把$.ajax post同步了，还是解决不了问题，因为原来调用html2canvas还是异步的。

如何让页面等待html2canvas和$.ajax完成？有人有什么建议吗？

标签： javascripthtml2canvas