图像的访问控制允许来源问题

时间:2019-08-26 10:26:13

标签: javascript reactjs image cors

我正在尝试使用函数从其他网址添加图片,而cors表示我的请求已被阻止。

我尝试向图像添加cossOrigin属性,但它似乎仍然不起作用

function getDataUri(url, callback) {
          var image = new Image();
          image.crossOrigin = "Anonymous"

          image.onload = function () {
            var canvas = document.createElement('canvas');
            canvas.width = this.naturalWidth; // or 'width' if you want a special/scaled size
            canvas.height = this.naturalHeight; // or 'height' if you want a special/scaled size

            canvas.getContext('2d').drawImage(this, 0, 0);

            // Get raw image data
            // callback(canvas.toDataURL('image/png').replace(/^data:image\/(png|jpg);base64,/, ''));

            // ... or get as Data URI
            callback(canvas.toDataURL('image/png'));
          };

          image.src = url;
        }

 getDataUri(imageurl, function (dataURI) {

 })

CORS策略已阻止从来源“ http://localhost:8000”访问“ imageurl”处的图像:请求的资源上没有“ Access-Control-Allow-Origin”标头。

1 个答案:

答案 0 :(得分:-1)

我总是这样做:image.setAttribute('crossOrigin','');