vue2、vue3实现用aws s3协议操作minio进行文件存储和读取
亚马逊s3 API文档
最开始安装了@aws-sdk/client-s3，但是不知道为什么一直报错，所以用了aws-sdk
准备工作：
需要已经搭建好minio、创建好桶
1. vue2
安装插件
yarn add aws-sdk s3配置
var AWS = require("aws-sdk");
AWS.config.update({accessKeyId: accessKeyId,secretAccessKey: secretAccessKey,endpoint: `http://${minio的ip地址}:${minio的端口}`,s3ForcePathStyle: true, // 如果使用 MinIO，请设置为truesignatureVersion: "v4",
});
let s3 = new AWS.S3({apiVersion: "2006-03-01",
});封装上传文件函数 utils/minio.js中
// 上传文件
export const uploadFile = (bucketName, fileName, file, type, size) => {return new Promise((reslove, reject) => {s3.putObject({Bucket: bucketName,Key: fileName,Body: file,ACL: 'public-read',ContentType: type,ContentLength: size},(err, data) => {if (err) {console.log(err);// 上传失败} else if (data) {console.log(data);reslove(data.Location);}});});
};注意： ContentType 必传 不传的话上传到minio中的文件无法进行在线预览。
调用
import { uploadFile } from "@/utils/minio.js";uploadS3File(bucketName,fileName,file,mineType,fileSize).then((location) => {// location为minio中etag的值 若返回location则为上传成功
})2. vue3 + vite
vue3中与vue2中的使用方法基本相同，不同的是插件的引用。
1.vue3中无法使用require所以采用import引入
import AWS from 'aws-sdk'2.可能会报错globel不存在
创建pollyfill.js文件, 内容如下
if (typeof window.global === "undefined") {window.global = window;
}
3.在main.js中引入（注意放在createApp之前）
import '@/utils/pollyfill'
import { createApp } from "vue";4.在index.html中加入
<script>glboal = globalThis</script>即可引入成功