三种办法
1.ie11才支持,ie10及以下不支持。
const im = new Image()
img.setAttribute('crossOrigin', 'Anonymous')
同时在后台设置跨域响应头。
- 支持ie10的跨域
使用createObjectURL
,URL.createObjectURL()
静态方法会创建一个DOMString
,该字符串就是参数中给出的对象对应的URL。
stackoverflow
还可以看下preloadjs源码
var xhr = new XMLHttpRequest();
xhr.onload = function () {
var url = URL.createObjectURL(this.response);
img.src = url;
// here you can use img for drawing to canvas and handling
// don't forget to free memory up when you're done (you can do this as soon as image is drawn to canvas)
URL.revokeObjectURL(url);
};
xhr.open('GET', url, true);
xhr.responseType = 'blob';
xhr.send();
注意这个createObjectURL
这个api还可以用来做图片预览的功能,具体可以看司徒正美的文章。这两篇文章写得也很好:JavaScript 中 Blob 对象,支持IE9的异步文件上传研究。
- 要兼容ie9及一下,目前搜索情况来看只能使用代理转发,请求相同域下的图片地址。node端跨域使用
node-http-proxy