将图像缓冲区转换回 base64 时出现错误

Question

我遇到一个奇怪的错误，当我将 base64 字符串转换为图像缓冲区 (Buffer.from(image, "base64")) 并返回到 base64 (.toString("base64")) 时，生成的 base64 字符串缺少其格式 ( dataimage/pngbase64 而不是 data:image/png;base64) 以及末尾缺少 g==。当我将图像放在前端的 <img /> 中时，这会导致图像“损坏”并且无法渲染。我目前使用的解决方法如下：

image.toString("base64").replace("dataimage/pngbase64", "data:image/png;base64,") + "g=="

但这远非最佳解决方案，我不想使用这种解决方法。

这是我缓冲图像（image 是 base64）并将其存储在数据库中的地方

t.field("createModel", {
  type: $name,
  args: { input: nonNull(arg({ type: createModelInput.name })) },
  resolve: async (_, args) => {
    const { image, name, manufacturerId, identifiers } = args.input;

    console.log(image) // correct base64 image from frontend
    const buffedImage = Buffer.from(image, "base64");
    console.log(buffedImage.toString("base64")) // not the same as image above: missing formatting & g== at the end

    return await prisma.model.create({
      data: {
        image: buffedImage,
        name,
        identifiers,
        manufacturer: {
          connect: {
            id: manufacturerId,
          },
        },
      },
    });
  },
});

如果需要更多信息，请告诉我。

Answer 1

字符串的 Base64 部分在 , 之后才开始； data:部分是方案，image/png部分是内容类型，base64,部分是指示遵循的是Base64编码文本。因此，当您尝试将整个字符串用作 Base64 时，您要求转换非 Base64 数据。

您必须先删除该前缀，因为它不是 Base64 数据的一部分。它只是 data: URI 的一部分。

将图像缓冲区转换回 base64 时出现错误

Bug when converting image buffer back to base64

javascript

base64

node.js

typescript

tobase64string