Холст был испорчен данными из разных источников с помощью computedStyleMap (). Get ("background-image") - PullRequest
Новая
       156

Холст был испорчен данными из разных источников с помощью computedStyleMap (). Get ("background-image")

0 голосов
/ 29 мая 2020 
<div id='img3'>background-image with this</div>

#img3 {
  background-image: url("../icons/we-flow.png");
}

var img = img3.computedStyleMap().get("background-image");
//img=img1;
var canvas=document.createElement('canvas');
img.crossOrigin="Anonymous";
var ctx=canvas.getContext('2d');
try {
  ctx.drawImage(img, 0, 0);
  var data=ctx.getImageData(0, 0, canvas.width, canvas.height).data;
}catch (error) {
  console.log('refresh page will get this', img.toString(), {error, img});
}

запустите этот код с chrome 83, загрузите код в первый раз, все в порядке, но когда я обновил sh страницу в браузере, я получил console.log: 

DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.

почему и как это исправить?

1 Ответ

2 голосов
/ 31 мая 2020

В текущей реализации Chromium CSSImageValue::WouldTaintOrigin настроен на возврат true, всегда.

https://github.com/chromium/chromium/blob/master/third_party/blink/renderer/core/css/cssom/css_style_image_value.h#L32

 bool WouldTaintOrigin() const final { return true; }

Если вы можете чтобы получить данные холста после того, как вы нарисовали такой источник изображения на холсте, немедленно сообщите об ошибке команде Chrome, так как это будет проблемой безопасности. (Но я не могу воспроизвести это самостоятельно Chrome 83 или какие-либо другие ветки).

Обратите внимание, что в настоящее время HTML спецификации по-прежнему не включают CSSImageValue в качестве потенциального источника , но план состоит в том, что он попадет в HTMLOrSVGImageElement ветку is-origin-clean al go. Итак, CSSImageValue должен испортить холст только в случае запроса из разных источников, но, учитывая молодость API-интерфейсов и сложность хранения этой информации во всех этих часто меняющихся интерфейсах, разработчики просто ошиблись стороны безопасности, просто помечая его как небезопасный все время, поскольку им разрешено поступать с любым источником, который они считают небезопасным.

...