PHP/Javascript/HTML5画布-加载外部图像

好的，我想：

抓取外部图像

将其导入画布对象

压缩它

省省吧

我已经完成了处理本地图像的全部工作，但是尝试将外部图像导入画布对象会产生安全错误

通过使用PHP，我可以在本地创建外部文件的副本：

file_put_contents("copy.jpg", file_get_contents("http://external.com/image.jpg"));

问题是，外部图像可能相当大-高达3MB，画布导入尝试在图像下载之前进行

是否有PHP或Javascript代码等待文件完全下载

---

或者有更好的方法吗？

如果要等待整个文件加载完毕，可以使用success回调操作画布：

document.onload=function（）{//load image}

如果要等待画布加载完成，请执行以下操作：

canvas.onload=function（）{//load image}

这是最简单的方法。但是，如果您想要更有效的结果，我建议使用jQuery。
使用ajax获取外部图像。在成功回调内或使用其他回调函数操纵画布。这里有一些演示代码

 $.ajax({

 success: function(success) {

 process(success);

 }

});

var process = function(input){

// manipulate the canvas here

}

您可以将php脚本用作代理<代码>imagefetch.php？src=http://example.com/kittens.jpg
。使用一些缓存逻辑，您只需获取一次图像，并且此脚本可以用作画布源-一旦服务器端获取完成，图像将仅进入画布。嗨，Marc，这到底是如何工作的？我对这个很陌生。图像对象存储在source_img_obj中，画布代码类似于so
var cvs=document.createElement（'canvas'）；cvs.width=源\图像\对象自然宽度；cvs.height=源高度和目标自然高度；var ctx=cvs.getContext（“2d”）.drawImage（source\u img\u obj，0,0）；var newImageData=cvs.toDataURL（mime类型，质量/100）imagefetch.php会去哪里？您只需将画布的图像源设置为您的php脚本。脚本基本上相当于
抱歉，我还是不懂。。。作为drawImage的一部分<代码>var ctx=cvs.getContext（“2d”）.drawImage（，0，0）