使用Image对象预加载图片:
const img = new Image(); img.crossOrigin = 'anonymous';
如果设置了crossOrigin,就要小心了。若在html <img/>标签内没有使用该属性,会造成两次图片请求,达不到预加载的效果。
原理是crossOrigin属性会在http请求头增加Origin头,导致两次请求是不同的(类似请求地址增加随机数去缓存效果)。
但是crossOrigin在处理canvas图片跨域报错时,是有用的。
使用Image对象预加载图片:
const img = new Image(); img.crossOrigin = 'anonymous';
如果设置了crossOrigin,就要小心了。若在html <img/>标签内没有使用该属性,会造成两次图片请求,达不到预加载的效果。
原理是crossOrigin属性会在http请求头增加Origin头,导致两次请求是不同的(类似请求地址增加随机数去缓存效果)。
但是crossOrigin在处理canvas图片跨域报错时,是有用的。