mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

Use crossOrigin images when useCORS option set

Browse Source
This commit is contained in:
Niklas von Hertzen 2017-09-03 21:24:06 +08:00
parent c013e49192
commit 906a66eec7
2 changed files with 27 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/Feature.js
View File

@ -59,6 +59,10 @@ const testBase64 = (document: Document, src: string): Promise<boolean> => {
}); });
}; };
const testCORS = () => {
return typeof new Image().crossOrigin !== 'undefined';
};
const testSVG = document => { const testSVG = document => {
const img = new Image(); const img = new Image();
const canvas = document.createElement('canvas'); const canvas = document.createElement('canvas');
@ -145,6 +149,13 @@ const FEATURES = {
const value = testForeignObject(document); const value = testForeignObject(document);
Object.defineProperty(FEATURES, 'SUPPORT_FOREIGNOBJECT_DRAWING', {value}); Object.defineProperty(FEATURES, 'SUPPORT_FOREIGNOBJECT_DRAWING', {value});
return value; return value;
},
// $FlowFixMe - get/set properties not yet supported
get SUPPORT_CORS_IMAGES() {
'use strict';
const value = testCORS();
Object.defineProperty(FEATURES, 'SUPPORT_CORS_IMAGES', {value});
return value;
} }
}; };

23
src/ImageLoader.js
View File

@ -35,7 +35,7 @@ export default class ImageLoader<T> {
if (isSVG(src)) { if (isSVG(src)) {
if (this.options.allowTaint === true || FEATURES.SUPPORT_SVG_DRAWING) { if (this.options.allowTaint === true || FEATURES.SUPPORT_SVG_DRAWING) {
return this.addImage(src, src); return this.addImage(src, src, false);
} }
} else { } else {
if ( if (
@ -43,9 +43,13 @@ export default class ImageLoader<T> {
isInlineBase64Image(src) || isInlineBase64Image(src) ||
this.isSameOrigin(src) this.isSameOrigin(src)
) { ) {
return this.addImage(src, src); return this.addImage(src, src, false);
} else if (typeof this.options.proxy === 'string' && !this.isSameOrigin(src)) { } else if (!this.isSameOrigin(src)) {
// TODO proxy if (typeof this.options.proxy === 'string') {
// TODO proxy
} else if (this.options.useCORS === true && FEATURES.SUPPORT_CORS_IMAGES) {
return this.addImage(src, src, true);
}
} }
} }
} }
@ -102,7 +106,7 @@ export default class ImageLoader<T> {
return typeof this.cache[key] !== 'undefined'; return typeof this.cache[key] !== 'undefined';
} }
addImage(key: string, src: string): string { addImage(key: string, src: string, useCORS: boolean): string {
if (__DEV__) { if (__DEV__) {
this.logger.log(`Added image ${key.substring(0, 256)}`); this.logger.log(`Added image ${key.substring(0, 256)}`);
} }
@ -112,7 +116,7 @@ export default class ImageLoader<T> {
const img = new Image(); const img = new Image();
img.onload = () => resolve(img); img.onload = () => resolve(img);
//ios safari 10.3 taints canvas with data urls unless crossOrigin is set to anonymous //ios safari 10.3 taints canvas with data urls unless crossOrigin is set to anonymous
if (!supportsDataImages) { if (!supportsDataImages || useCORS) {
img.crossOrigin = 'anonymous'; img.crossOrigin = 'anonymous';
} }
@ -127,7 +131,12 @@ export default class ImageLoader<T> {
if (this.options.imageTimeout) { if (this.options.imageTimeout) {
const timeout = this.options.imageTimeout; const timeout = this.options.imageTimeout;
setTimeout( setTimeout(
() => reject(__DEV__ ? `Timed out (${timeout}ms) fetching ${src}` : ''), () =>
reject(
__DEV__
? `Timed out (${timeout}ms) fetching ${src.substring(0, 256)}`
: ''
),
timeout timeout
); );
} }