通过Javascript调整图像大小

我已经运行了一个web应用程序。它使用ajax上传。问题是最近用户上传的图片太大了。所以这需要更多的时间。用户对此表示不满。所以我的想法是，‘如果我通过js裁剪并调整图像大小，然后通过ajax上传将其发送到服务器，那么时间就会减少’。那么有没有办法做到这一点？有什么想法吗？

解决方案是使用诸如FileReader和Canvas之类的现代方式（但这只适用于最新的现代浏览器）

在这个例子中，我展示了如何让客户端在上传之前通过设置最大宽度和高度保持纵横比来调整图像的大小

在本例中，最大宽度高度=64； 您的最终图像是c.toDataURL（）

是基于图像的64_字符串，您可以将其存储在隐藏输入中，附加到

新FormData（）

或任何您想要的位置

在服务器上

$data=explode(',',$base64_string);
$image=base64_decode($data[1]);

写入文件

$f=fopen($fileName,"wb");
fwrite($f,$image); 
fclose($f);

或

---

您还可以将整个base64图像字符串存储在数据库中，并始终使用它。

为什么不对文件大小和维度进行限制？可能会重复，即使非常旧的图像字符串仍保留在该点上。设置限制将迫使用户自己对其进行修改。但这会导致网站订阅的丢失。只要我们选择了文件，这段代码就会在DOM中添加一个img标记。点击一个按钮，将图像上传到服务器上怎么样？我想我们需要把这个图像放到一个流中，然后把这个流上传到服务器上？那么，如何在服务器上转换此流以创建图像文件呢？我是一名.net人员：）但是感谢这些代码，我相信有人会从中受益；）使用.net解码base64，但首先用逗号拆分/分解字符串。第二部分是所需的数据。

$data=explode(',',$base64_string);
$image=base64_decode($data[1]);

$f=fopen($fileName,"wb");
fwrite($f,$image); 
fclose($f);

$gd=imagecreatefromstring($image);