Я столкнулся со странной javascript ошибкой в Safari iOS, связанной с элементами холста: после вызова getImageData () в контексте HTML холста более пары сотен раз (либо последовательно, либо с паузами между ними), происходит сбой со следующими сообщениями об ошибках:
Невозможно получить данные изображения с холста. Запрошенный размер был 2088 x 1088
и
InvalidStateError: объект находится в недопустимом состоянии.
Важно, чтобы результат imagedata каким-то образом используются на каждой итерации, иначе ошибка не возникнет.
Вот код, необходимый для воспроизведения проблемы:
<html>
<body>
<button onClick="myFunction()">Click me for error in console</button>
<canvas id="canvas" width="2088" height="1088" />
</body>
<script>
function myFunction() {
const ctx = document.getElementById('canvas').getContext('2d');
for (let i = 0; i < 400; i++) {
let image = ctx.getImageData(0, 0, 2088, 1088);
console.log(image);
}
}
</script>
</html>
Ошибки возникают только в Safari на iOS, Google Chrome (рабочий стол) работает нормально.
Может ли кто-нибудь подсказать мне, что здесь происходит?