我为客户端建立了一个系统,它允许您选择或上传汽车图像,在中键入数字,然后移动/调整大小/旋转/将板倾斜到正确的位置,然后下载图像:html2canvas - 在iOS设备上崩溃
这都是每次我在测试设备上精美工作,除了iPhone手机,其中最后一部分 - 下载图像 - 崩溃的页面并使其重新加载。这在我测试过的任何其他设备上都不会发生,包括Android,Windows甚至Macbook上的Safari。
我已经添加了一些数字警报,以查看问题发生的确切位置,并且在您刚刚重新加载页面之前,您在iPhone上未获得2,这表明html2canvas函数触发问题。
代码:使用
document.ready(function()
{
$("#previewSaveImage").click(screenShot);
});
function screenShot()
{
alert("1");
$("#previewSaveImage").attr("disabled", "true").val("Downloading...");
alert("2");
html2canvas($("#previewImageFullContainer")).then(function(canvas)
{
alert("3");
var dataURL = canvas.toDataURL();
alert("4");
$.post("savePNG.php", {"data": dataURL}, function(response)
{
alert("5");
var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
alert(iOS);
if(iOS==true)
{
alert("Your image will now open in this browser window. To save it, long-press and choose Save Image.\n\nTo return to the main site, press back in your browser.");
document.location='/preview_images/'+response;
}
else
{
window.location.href='/preview_images/download.php?img='+response;
}
alert("6");
$("#previewSaveImage").removeAttr("disabled").val("Download Image");
alert("7");
});
});
}
html2canvas的最新版本 - 0.5.0-α1 - 因为它是支持CSS3转换,我需要的,唯一的版本 - 正如声明 - 条目的事情完美的作品上Android手机,Windows和Macbook。
任何想法iPhone上可能会阻止这个工作? (如果你想知道var iOS行代码是什么,我会检测iOS,因为这些设备不支持自动下载文件(grrr!),并在浏览器窗口中打开生成的图像让用户长按并保存,我已经尝试完全删除这部分代码来解决iOS的主要问题,并没有什么区别)。