图片上传 – 如何获得适合服务器端处理的图片数据格式
我使用sharp来处理服务器端的图像， 并对dropzone进行反应以获取图像文件。 当我从dropzone发布文件到服务器，我得到的blob从request.body看起来像这样：
{ preview: 'blob:http%3A//127.0.0.1%3A3000/1451580a-b24f-478f-a9f7-338c0d790829' }
（可选）在将数据发送到服务器之前，我可以使用FileReader（或其他）来对图像文件进行操作，而不是将其转换为Blob。
夏普需要：
- 包含JPEG，PNG，WebP，GIF，SVG，TIFF的缓冲区
- 原始像素图像数据
- 包含图像文件path的string，支持大多数主要格式。
我如何使用我必须提供的支持格式？
我build议尝试一个名为Multer的node.js模块来帮助您访问服务器上的照片文件。
https://github.com/expressjs/multer
首先，在客户端上，你需要将你的文件附加到一个FormData对象，如下所示：
// obtain the file from your react dropzone and save it to this file variable const file = dropzone.file // not sure how you do this with react dropzone const data = new FormData() data.append('photo', file)
然后你将这个FormData对象发送到你的服务器。 在服务器上，您将使用Multer的路线来处理照片。
确保你npm安装了multer，并在你的服务器或路由文件中要求它。 如果你发送一个文件，你将使用Muller“single”方法。 如果你想做任何不同的事情，请查看API文档。
app.post('/photos', multer().single('photo'), controller.processPhoto);
在这个示例路由中，您正在向/ photos发送POST请求，multer正在查找带有“photo”的FormData键的文件，并将其附加到请求对象。
然后在这个“controller.processPhoto”方法中，你可以在req.file中作为请求对象的一个属性来访问图像。 有了这个，你可以很容易地访问很多好的信息，包括图像缓冲req.file.buffer ，它听起来像你需要的。 （也是mimetype，原名等）
这应该足以让你开始。