前端使用minio传输文件

2024-06-04 8265阅读

minio官方文档

minio-js可以支持ts。

安装完可能会出现

Can‘t import the named export ‘xxx‘ from non EcmaScript module (only default export is available)

可以尝试降低minio的版本

npm install minio@7.0.18 --save

代码:

初始化
const Minio = require('minio')
 
const minioClient = new Minio.Client({
  endPoint: '192.l68.0.1', //minio服务器ip,不能加http://
  port: 9000,
  accessKey: 'xxxx', //username
  secretKey: 'xxxx', //password
  useSSL: false  //https访问需要设置为true
})
上传文件
 
const stream = require('stream')
 
/**
 *
 * @export 上传文件(stream流方法)
 * @param {*} backetName String 存储桶名字
 * @param {*} fileObj Object 文件对象
 * @param {*} callback function 回调函数
 */
export function uploadFile (backetName, fileObj, callback) {
  console.log(backetName, fileObj)
  if (fileObj) {
    const file = fileObj
    if (file === undefined) {
      // 未选择
    } else {
      const date = new Date()
      const year = new Date().getFullYear()
      const month =
        date.getMonth() + 1  9 ? date.getDate() : '0' + date.getDate()
      const fileName = date.getTime() + file.name
      const fileDate = '' + year + month + day
      const mineType = file.type
      const fileSize = file.size
      console.log('fileName', fileName)
      // 参数
      const metadata = {
        'content-type': mineType,
        'content-length': fileSize
      }
      // 判断储存桶是否存在
      minioClient.bucketExists(backetName, function (err) {
        console.log('判断储存桶是否存在')
        if (err) {
          if (err.code === 'NoSuchBucket') {
            return console.log('bucket does not exist.')
          }
          console.log('1233221')
          return console.log(err)
        }
        // 准备上传
        const reader = new FileReader()
        reader.readAsDataURL(file)
        reader.onloadend = function (e) {
          const dataurl = e.target.result
          const blob = toBlob(dataurl)
          const reader2 = new FileReader()
          reader2.readAsArrayBuffer(blob)
          reader2.onload = function (ex) {
            const bufferStream = new stream.PassThrough()
            bufferStream.end(Buffer.from(ex.target.result))
            minioClient.putObject(
              backetName,
              `${fileDate}/${fileName}`,
              bufferStream,
              fileSize,
              metadata,
              (err) => {
                if (err == null) {
                  minioClient.presignedPutObject(
                    backetName,
                    `${fileDate}/${fileName}`,
                    24 * 60 * 60,
                    function (err1, presignedUrl) {
                      console.log(err1)
                      if (err1) return
                      if (presignedUrl) {
                        const arr = presignedUrl.split('?')
                        if (arr.length === 2) {
                          callback(arr[0])
                        }
                      }
                    }
                  )
                }
              }
            )
          }
        }
      })
    }
  }
}
 
/**
 *
 * @export base64转blob
 * @param {*} base64Data Object base64数据
 * @return {*} blob
 */
export function toBlob (base64Data) {
  let byteString = base64Data
  if (base64Data.split(',')[0].indexOf('base64') >= 0) {
    byteString = window.atob(base64Data.split(',')[1]) // base64 解码
  } else {
    byteString = unescape(base64Data.split(',')[1])
  }
  // 获取文件类型
  const mimeString = base64Data.split(';')[0].split(':')[1] // mime类型
  const uintArr = new Uint8Array(byteString.length) // 创建视图
 
  for (let i = 0; i  {
    if (err) {
      minioClient.makeBucket(bucketName, 'us-east-1', err1 => {
        if (err1) {
          console.error(`${info.file.name}文件上传失败`)
          return
        }
        uploadFile(bucketName, info, callback)
      })
    } else {
      uploadFile(bucketName, info, callback)
    }
  })
}
 
// 先判断桶是否存在
export function connectionStatus (bucketName, callback) {
  minioClient.bucketExists(bucketName, err => {
    console.Log(err)
    callback(err)
  })
}
上传文件简单版:
const bucketName = 'picturebook-version'; // 替换为你的存储桶名称
const objectName = file.file.name; // 使用文件名作为对象名称
//创建 FileReader 对象
const reader = new FileReader();
// 当读取完成时触发的回调函数
reader.onload = (event) => {
	// 从事件对象中获取文件内容
	const fileContent = event.target.result;
	// 转换 ArrayBuffer 为 Buffer 类型数据
	const buffer = Buffer.from(fileContent);
	
	// 使用 putObject 方法上传文件内容
	this.minioClient.putObject(bucketName, objectName, buffer, buffer.length, (err, etag) => {
		if (err) {
			console.error('上传文件失败:', err);
		} else {
			this.fileList.push(this.newFile);
			this.fileName = objectName;
			 console.log('文件上传成功,ETag:', etag);
		}
	});
};
// 开始读取文件
reader.readAsArrayBuffer(file.file);
下载文件
 
export function downloadFile (bucketName, fileName, callback) {
  minioClient.getObject(bucketName, fileName, (err, dataStream) => {
    callback(err, dataStream)
  })
}
使用
上传

    免责声明:我们致力于保护作者版权,注重分享,被刊用文章因无法核实真实出处,未能及时与作者取得联系,或有版权异议的,请联系管理员,我们会立即处理! 部分文章是来自自研大数据AI进行生成,内容摘自(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供学习参考,不准确地方联系删除处理! 图片声明:本站部分配图来自人工智能系统AI生成,觅知网授权图片,PxHere摄影无版权图库和百度,360,搜狗等多加搜索引擎自动关键词搜索配图,如有侵权的图片,请第一时间联系我们,邮箱:ciyunidc@ciyunshuju.com。本站只作为美观性配图使用,无任何非法侵犯第三方意图,一切解释权归图片著作权方,本站不承担任何责任。如有恶意碰瓷者,必当奉陪到底严惩不贷!

    目录[+]