javascript – html2canvas works on desktop and iPadOS however not on iOS

By
Channel969
-
0
70


I have been having this drawback for some time now, the consumer of my web site uploads a picture after which the picture is positioned inside a template that has already been positioned on the web site.

When I attempt to use html2canvas on desktop, every little thing works, however after I tried to execute it on my iPhone, it did not work and simply resulted in a picture.jpg.txt file.

Then, I examined it on my iPad simply to determine if the issue is with cell gadgets or simply iOS, and executing it on my iPad labored and resulted in a picture file.

HTML:

    <div id="header">
        <a href="index.html" id="generalLink">Common</a>
        <a href="page2.html" id="rehearsalLink">Page2</a>
    </div>
    <enter sort="file" settle for="picture/*" onchange="imageUpload(occasion);" id="imageUpload">Add Picture</enter>
    <div class="frameMain">
        <div id="frameContainer">
            <img src="pictures/generalFrame.png" alt="" class="frameImage">
            <div id="uploadedImage">
        </div>
    </div>
    <script src="https://cdn.jsdelivr.internet/npm/html2canvas@newest/dist/html2canvas.min.js"></script>
    <script src="index.js"></script>

JavaScript:

operate imageUpload(occasion){
    if(occasion.goal.information.size > 0){
      var src = URL.createObjectURL(occasion.goal.information[0]);
      var preview = doc.getElementById("uploadedImage");
      preview.model.backgroundImage = "url(" + src + ")";
    }
    
    let myElement = doc.getElementById("frameContainer");
    console.log(myElement)

    html2canvas(myElement).then(canvas => {
      const hyperlink = doc.createElement('a');
      hyperlink.obtain = 'picture.jpg';
      hyperlink.href = canvas.toDataURL('picture/jpg');
      doc.physique.appendChild(hyperlink);
      hyperlink.click on();
      }).catch(error => {
      console.error('Error:', error);
      });
}