在现代应用开发中,文件上传是一个常见的需求。为了提高上传的安全性和效率,MinIO 提供了服务端签名直传(Server-Side Signed URL)功能,允许前端直接将文件上传到 MinIO 服务,而不是首先将文件上传到后端。这种方式不仅减轻了后端的负担,还提高了上传速度。接下来,我们将探讨如何实现 MinIO 的服务端签名直传,包括前端、后端的代码示例以及效果演示。

一、MinIO 简介

MinIO 是一个高性能的对象存储服务,提供兼容 Amazon S3 的 API,支持大规模的数据存储和管理。在一些需要处理大量文件上传、下载和存储的应用场景下,MinIO 是一个非常优秀的选择。

二、服务端签名直传的原理

服务端签名直传的基本思路是: 1. 前端请求后端生成一个有限时有效的签名 URL。 2. 后端使用 MinIO SDK 生成签名 URL,返回给前端。 3. 前端使用该签名 URL 直接将文件上传到 MinIO。

三、后端实现

我们首先来实现后端部分。以 Node.js 和 Express 为例,以下是一个简单的后端实现代码:

const express = require('express');
const Minio = require('minio');
const app = express();
const port = 3000;

const minioClient = new Minio.Client({
  endPoint: 'YOUR_MINIO_ENDPOINT',
  port: 9000,
  useSSL: true,
  accessKey: 'YOUR_ACCESS_KEY',
  secretKey: 'YOUR_SECRET_KEY'
});

// 生成签名 URL
app.get('/generate-signed-url', (req, res) => {
  const fileName = req.query.fileName;
  const expires = 60 * 5; // URL 有效期 5 分钟

  minioClient.presignedPutObject('YOUR_BUCKET_NAME', fileName, expires, (err, url) => {
    if (err) {
      return res.status(500).json({ error: err.message });
    }
    res.json({ url });
  });
});

app.listen(port, () => {
  console.log(`示例应用运行在 http://localhost:${port}`);
});

四、前端实现

接下来,我们来实现前端部分。以下是一个使用 HTML 和 JavaScript 的简单实现:

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>MinIO 服务端签名直传 Demo</title>
</head>
<body>
  <h1>MinIO 文件上传</h1>
  <input type="file" id="fileInput" />
  <button id="uploadBtn">上传文件</button>

  <script>
    document.getElementById('uploadBtn').onclick = async function () {
      const fileInput = document.getElementById('fileInput');
      const file = fileInput.files[0];

      if (!file) {
        alert('请选择一个文件');
        return;
      }

      // 请求后端获取签名 URL
      const response = await fetch(`/generate-signed-url?fileName=${file.name}`);
      const { url } = await response.json();

      // 使用签名 URL 直接上传文件
      const uploadResponse = await fetch(url, {
        method: 'PUT',
        body: file,
      });

      if (uploadResponse.ok) {
        alert('文件上传成功!');
      } else {
        alert('文件上传失败!');
      }
    };
  </script>
</body>
</html>

五、效果演示

在以上代码中,当用户选择一个文件并点击“上传文件”按钮时,前端会向后端请求生成签名 URL。后端返回生成的 URL 后,前端会使用该 URL 直接将文件上传到 MinIO。整个过程无需经过后端中转,不仅提升了效率,也增强了安全性。

六、总结

通过 MinIO 的服务端签名直传功能,我们可以高效、安全地处理文件上传。以上示例展示了如何搭建一个简单的文件上传服务,实际应用中可能需要考虑更多的安全性和容错机制,如限制文件类型、大小等。希望本文对你在使用 MinIO 进行文件操作时有所帮助!

点赞(0) 打赏

微信小程序

微信扫一扫体验

微信公众账号

微信扫一扫加关注

发表
评论
返回
顶部