SecurityError when using Data URI background-image in Safari 11.1

[ryenbeatty]

Hi there,

When trying to render a div with a background-image property set to a Data URI in Safari, html2canvas is throwing an Unhandled Promise Rejection:
Unhandled Promise Rejection: SecurityError: The operation is insecure.

This happens after the 'Render complete' phase happens, example console logs:

Example source html:
<div style="background-image: url('data:image/svg+xml;base64,...');" />

Seems to be a duplicate of this issue

Thanks,
Ryen

Specifications:

• html2canvas version tested with: 1.0.0-alpha.12
• Browser & version: Safari 11.1
• Operating system: macOS Sierra 10.12.16

[Mivnv]

I've got the same error. Any updates here ?

[kxgio]

Same here with following css

background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 200 200'%3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='100' y1='33' x2='100' y2='-3'%3E%3Cstop offset='0' stop-color='%23000' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='100' y1='135' x2='100' y2='97'%3E%3Cstop offset='0' stop-color='%23000' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23000' stop-opacity='1'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='%23ca481d' fill-opacity='0.6'%3E%3Crect x='100' width='100' height='100'/%3E%3Crect y='100' width='100' height='100'/%3E%3C/g%3E%3Cg fill-opacity='0.5'%3E%3Cpolygon fill='url(%23a)' points='100 30 0 0 200 0'/%3E%3Cpolygon fill='url(%23b)' points='100 100 0 130 0 100 200 100 200 130'/%3E%3C/g%3E%3C/svg%3E");

[hex-ci]

I've got the same error.

This problem seems to be in some browsers, inline images also need to be processed according to cross-domain images.

Related code:

html2canvas/src/ResourceLoader.js

Line 42 in 41eb8ab

if (this.options.allowTaint === true || isInlineImage(src) || this.isSameOrigin(src)) {

When I deleted isInlineImage(src) everything worked fine.