目前缺乏Cross-Origin设置支持,导致使用canvas进行图片处理无法进行
一段简单的使用canvas将图片转base64代码如下:
cmr = plus.camera.getCamera();
return cmr.captureImage(function(pic) {
console.log("take photo success:" + pic);
return plus.io.resolveLocalFileSystemURL(pic, function(entry) {
var canvas, ctx, hideImage;
console.log(entry);
canvas = document.createElement('canvas');
ctx = canvas.getContext("2d");
hideImage = new Image();
hideImage.src = entry.fullPath;
hideImage.crossOrigin = "Anonymous";
return hideImage.onload = function() {
var imgBase64Str, res;
canvas.width = picWidth;
canvas.height = picHeight;
ctx.drawImage(hideImage, 0, 0);
imgBase64Str = canvas.toDataURL("image/" + type);
console.log("img type:" + type);
console.log("imgBase64Str:" + imgBase64Str);
res = imgBase64Str.replace("data:image/" + type + ";base64,", "");
console.log("img result:" + res);
return console.log({
"filePath": pic,
"data": res
});
};
}, function(e) {
return console.log(e);
});
}, function(e) {
return console.log("take photo fail:" + e.message);
});
hideImage.crossOrigin设置过程报错:
Cross-origin image load denied by Cross-Origin Resource Sharing policy.
不进行设置报错:
Uncaught SecurityError: An attempt was made to break through the security policy of the user agent.
这个特性支持的好处是可以去除所有Cross-Origin限制,包括xhr.jar包就可以直接去除了,减少了大量代码出错的可能性及代码维护量
0 个回复