如何使用 Prisma 2 和 NodeJS 将图像存储到 PostgreSQL 中？

Question

大家好，我一直在寻找类似的可以参考的东西，但遗憾的是直到现在我还没有找到。希望有人能给我一些指导......

我使用filepond发送api请求，并使用prisma 2客户端来存储它

谢谢！

Answer 1

将图像存储在 Blob 存储中通常是一个很好的做法，并且图像不应直接存储在数据库中，因此您可以使用 AWS S3 或 Cloudinary 来存储图像并将图像的 S3 存储桶路径存储在您的 PostgreSQL 数据库。

这是一个如何实现它的工作示例。

Answer 2

我的项目中有这个用于设置徽标

const eventSetLogo = (e: React.ChangeEvent<HTMLInputElement>) => {
    const file = e.target.files?.item(0);

    if (file) {
      const size = file.size;

      if (size > FILE_MAX_SIZE) {
        alert("Your file can be maximum 100kb in size.");
        props.setLogo(undefined);
        return
      }

      // https://developer.mozilla.org/en-US/docs/Web/API/FileReader
      const reader = new FileReader();
      // The readAsDataURL method of the FileReader interface is used to read the contents
      // of the specified Blob or File. When the read operation is finished, the readyState
      // becomes DONE, and the loadend is triggered. At that time, the result attribute
      // contains the data as `enter code here`a data: URL representing the file's data as a base64 encoded string.
      // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL
      reader.readAsDataURL(file as Blob);

      // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/loadend_event
      reader.onloadend = () => {
        // CREATE BASE64 STRING
        // https://en.wikipedia.org/wiki/Base64
        // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/result
        const file64 = reader.result;

        // https://developer.mozilla.org/en-US/docs/Web/API/FileList/item
        props.setLogo(file64 as string);
      };

      // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/error_event
      reader.onerror = () => {
        console.error(reader.error);
      };
    }
  };