html2canvas: Not working on iOS devices

Hello,

I´m using html2canvas with Wordpress. It works fine on every desktop/android device but iOS is not working. I have tested iPhone SE (iOS 11.2.1) Safari/Chrome and iPad 2 (iOS 9.3.5) Safari/Chrome. I´m using 1.0.0-alpha.9 html2canvas. It returns only white background as img. You can test it here - http://konf.inforadar.sk - “Uložit do galerie” is a save to gallery button and in top right corner is a gallery (galeria).

Code:

<script src="inc/html2canvas.min.js"></script>
<script type="text/javascript">
jQuery(document).on("click", "#vpc-add-to-cart", function(event) { takeScreenshot(); event.stopImmediatePropagation(); } );
function takeScreenshot() {
    var element = jQuery("#vpc-preview")[0];
    html2canvas(element, { "background": "#FFFFFF" }).then(function(canvas) {
        var imgData = canvas.toDataURL('image/jpeg',1.0);
        jQuery.ajax({
            url: 'gallery/save.php',
            type: 'post',
            dataType: 'text',
            data: { base64data: imgData }
        });
        window.alert('Uloženo!');
    });
}
</script>

Any advice? Thank you very much!

About this issue

Original URL
State: open
Created 6 years ago
Reactions: 2
Comments: 15

Most upvoted comments

found this solution.

 var s = document.createElement("script");
  if(isSafari()){
    s.src = "https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha1/html2canvas.min.js";
  }else{
    s.type = "text/javascript";
    s.src = "js/scripts/html2canvas.js"; // version html2canvas 1.0.0-rc.7
  }
  
  $("head").append(s);

https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-alpha1/html2canvas.min.js seems to be working on safari/IOS devices but not on chrome/android

0xmaayan on Aug 14, 2020