Canvas.toDataUrl выдает ошибку безопасности на IOS и нет ошибки на Android - PullRequest
0 голосов
/ 13 марта 2019

У меня небольшой сайт. При нажатии на кнопку создается скриншот страницы и отправляется на почту. При работе с устройствами на андроиде все работает нормально, при работе с яблоком возникает ошибка безопасности. Я прописал crossOrigin = 'Anonymous' в соответствии с рекомендациями для подобных проблем, но ошибка все еще возникает. В чем может быть проблема?

<script type="text/javascript">
    let path = window.location.protocol + '//' + window.location.host + window.location.pathname + 'save.php';

    function Order (elem) {
        let screen = null;

        function screenshot (canvas) {  
            document.body.appendChild(canvas);
            canvas.setAttribute('crossOrigin','anonymous');
            //canvas.crossOrigin = 'Anonymous';
            try {
                screen = canvas.toDataURL('image/png').replace(/data:image\/png;base64,/, '');
            } catch(e) {
                alert('Error ' + e.name + ":" + e.message + "\n" + e.stack);
            }
        }
        function send (e) {
            e.preventDefault();
            var data = new FormData(elem);
            data.append('image', screen);
            let xhr = new XMLHttpRequest;
            xhr.onreadystatechange = function (){
                if (this.readyState == 4) {
                    if (this.status == 200) {
                        console.log('Success. Image ' + this.responseText + ' saved');
                    } else {
                        console.log('Fail. Error: ' + this.responseText);
                    }
                }
            };
            xhr.open('POST', path, true);
            xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
            xhr.send(data);
            setTimeout(function () {
                window.location.href = "#";
            }, 2500);
        }            
        ////
        html2canvas(document.body)
        .then(screenshot);
        elem.onsubmit = send;
    }

    document.querySelector('.open-order').onclick = function () {
        let order = new Order(document.querySelector('.order'));
    };
</script>
...