如何使用 Hapi 19 将上传的图片传递给 Jimp？

Question

我们正在升级我们的前端，并使用了一段相当古老的代码，它允许我们将图像文件上传到后端以用作头像。

经过一番争论，我们设法说服 Vue.js 前端通过 FormData 将图像传递到后端。

问题是处理程序应该使用 Jimp 来调整图像大小并将副本放置在特定目录中。不幸的是，调整大小后的图像为 0 字节。

我们的上传路线

module.exports = {
  name: 'Upload Routes',
  register: async (server, options) => {
    server.route([
      {
        method: 'PUT',
        path: '/uploads/user/{md_ref}/image',
        handler: handleUpload,
        options: {
          payload: {
            allow: 'multipart/form-data',
            maxBytes: 209715200,
            multipart: true,
            output: 'file',
            uploads: './src/public/images/uploads',
            parse: true
          }
        }
      }
    ])
  }
}

和处理程序

async function handleUpload (req, h) {
  try {
    const path400 = './src/public/images/400/'
    const path200 = './src/public/images/200/'
    const path100 = './src/public/images/100/'
    const payload = req.payload
    const newImage = await Jimp.read(payload.file.path)
    await newImage.write(`${path400}${payload.file.filename}`)
    await newImage.write(`${path200}${payload.file.filename}`)
    await newImage.write(`${path100}${payload.file.filename}`)
    ...

我们知道图像已正确上传到 ./src/public/images/uploads - 如果我们将其重命名回 filename.jpg 那么我们就有了原始图像的副本。

Jimp 似乎从 payload.file.path 读取新图像，因为我们可以检查 newImage 并查看正确的尺寸等。然而，虽然 write() 函数在中创建新文件c 正确的目录，它们都是 0 字节。

有什么想法吗？

Answer 1

原来写完后端后Jimp已经更新了（不是很意外）

解决方法是在使用await时使用.writeAsync()而不是.write()

所以上面的代码（缩写为单写）应该是

const path400 = './src/public/images/400/'
const payload = req.payload
const newImage = await Jimp.read(`${payload.file.path})
await newImage.writeAsync(`${path400}${payload.file.filename}`)

如何使用 Hapi 19 将上传的图片传递给 Jimp？

How do I pass an uploaded Image to Jimp using Hapi 19?

multipartform-data

hapi

jimp