标题添加Access-Control-Allow-Origin“*”toDataURL无法正常工作

时间:2013-12-22 04:12:23

标签: javascript .htaccess todataurl

这就是我在网络服务器上的images文件夹中的.htaccess文件中所拥有的内容

# Do not remove this line, otherwise mod_rewrite rules will stop working 

RewriteBase /images

Header add Access-Control-Allow-Origin "*"

我也在我的JS文件中使用了行img.crossOrigin = 'Anonymous';,但我仍然收到错误。

Cross-origin image load denied by Cross-Origin Resource Sharing policy. 

可以在此处找到工作示例:http://jsfiddle.net/burton22/48JmQ/13/

var img = new Image();
img.onerror = function() {alert("error")};
img.onabort = function() {alert("abort")};

img.onload = function() {

    var canvas = document.createElement('CANVAS');
    var ctx = canvas.getContext('2d');
        canvas.height = img.height;
        canvas.width = img.width;
        ctx.drawImage(img,0,0,120,120);        
        var dataURL = canvas.toDataURL('image/png');


    alert("success");
}

img.crossOrigin = 'Anonymous';
img.src = "http://www.bobbycash.net/images/sushithumb.png";

只需查看控制台是否有错误。

将图像src属性更改为img.src = "http://goo.gl/AOxHAL"后,它可以正常工作,但不能用于我服务器上的图像。有什么想法吗?

编辑:我甚至尝试在我的htaccess文件中使用它,它仍然会给出相同的错误

<IfModule mod_setenvif.c>
    <IfModule mod_headers.c>
        <FilesMatch "\.(cur|gif|ico|jpe?g|png|svgz?|webp)$">
            SetEnvIf Origin ":" IS_CORS
            Header set Access-Control-Allow-Origin "*" env=IS_CORS
        </FilesMatch>
    </IfModule>
</IfModule>

0 个答案:

没有答案