如何使用 dropzone 为存储在服务器上的图像生成缩略图？

Question

我正在尝试显示已存储在服务器上的图像。我在 dropzone 中显示，使用以下代码：

myDropzone.emit("addedfile", mockFile);
myDropzone.emit("thumbnail", mockFile, "url/image");

但是有一个问题，生成的缩略图只会将尺寸缩小到指定的缩略图尺寸，而不会裁剪。

问题是当我调用函数缩略图时，裁剪图像失真。

是否可以使用现有方法生成临时缩略图并在缩略图函数调用中发送？

Answer 1

我建议您在服务器上创建缩略图，否则您的用户需要以原始大小下载所有图像，才能查看小缩略图。

话虽这么说，如果你还想继续，下载原件并在浏览器中调整大小，我刚刚发布 Dropzone v4.0.1 以包含功能 createThumbnailFromUrl()。

这样使用：

myDropzone.emit("addedfile", mockFile);
myDropzone.createThumbnailFromUrl(mockFile, '/your-image.jpg');

（旁注：图片需要托管在同一台服务器上，否则会出现跨源错误）