Я использую html2canvas для создания изображения из набора элементов HTML. Однако один из этих элементов имеет свойство background-image
с изображением, загруженным из другого источника. Это приводит к холсту получения испорчено, когда он генерация, в противном случае моего поколения изображения со следующей ошибкойТонкие холсты могут не экспортироваться при использовании CSS background-image
DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.
при попытке вызова toDataUrl()
на возвращенном холсте.
Изображение имеет Access-Control-Allow-Origin
заголовок установлен в *
так что я чувствую, что должен работать однако ошибка, конечно, не дает мне много идти дальше.
Есть много вопросов о загрузке изображений из разных источников в холсты с использованием image.crossOrigin = 'anonymous'
, но никто не упоминает изображения, загруженные как фоновое изображение, используя CSS, поэтому мне интересно, как с этим бороться?
Проверьте, действительно ли ваше изображение проходит CORS: можете ли вы использовать 'toDataURL', когда рисуете изображение непосредственно на пустом холсте (не как задний фон)? Кроме того, вы установили для html2canvas [useCORS] (http://html2canvas.hertzen.com/documentation.html) значение true? Если проблема сохраняется, возможно, html2canvas не проверяет фоновые изображения, и вам может понадобиться наложить img под div вместо использования фонового изображения. – markE