头像裁剪 oss

src/components/Cropper/src/CropperModal.vue

@@ -162,6 +162,8 @@
   import CropperImage from './CropperImage.vue';
   import { dataURLtoBlob ,base64ToFile} from '@/utils/file/base64Conver';
   import { isFunction } from '@/utils/is';
+  import { getOssConfig } from '@/api/common';
+  import OSS from 'ali-oss';
   import {
     UploadOutlined,
     ReloadOutlined,
@@ -253,8 +255,9 @@
         }
         const uploadApi = props.uploadApi;
         const name = props.name
+        const file = base64ToFile(previewSource.value,filename);
+        //接口上传
         if (uploadApi && isFunction(uploadApi)) {
-          const file = base64ToFile(previewSource.value,filename);
           try {
             setSubLoading(true);
             const formData = new FormData()
@@ -266,8 +269,66 @@
           } finally {
             setSubLoading(false);
           }
+        } else {
+          //oss上传
+          actionFiles(file)
         }
       }
+      const actionFiles = async (fileChild) => {
+        const configData = await getOssConfig();
+        let date = new Date();
+        let year = date.getFullYear();
+        let month: string | number = date.getMonth() + 1;
+        month = month < 10 ? '0' + month : month;
+        let day: string | number = date.getDate();
+        day = day < 10 ? '0' + day : day;
+        let h: string | number = date.getHours();
+        h = h < 10 ? '0' + h : h;
+        let minute: string | number = date.getMinutes();
+        minute = minute < 10 ? '0' + minute : minute;
+        let second: string | number = date.getSeconds();
+        second = second < 10 ? '0' + second : second;
+        let time = h + '' + minute + '' + second;
+        let filterFileName = time + '-' + fileChild.name;
+        filterFileName = filterFileName.replace(
+          /[\+\_\,\!\|\~\`\(\)\#\$\%\^\&\*\{\}\:\;\"\<\>\?]/g,
+          '',
+        );
+        let filePath = props.name + '/' + year + '/' + month + '/' + day + '/' + filterFileName;
+        setSubLoading(true);
+        try {
+          const headers = {
+            'Access-Control-Allow-Origin': '*',
+          };
+          const client = new OSS({
+            // yourRegion填写Bucket所在地域。以华东1（杭州）为例，yourRegion填写为oss-cn-hangzhou。
+            endpoint: configData.oss_endpoint,
+            // 从STS服务获取的临时访问密钥（AccessKey ID和AccessKey Secret）。
+            secure: true,
+            region: configData.oss_region,
+            accessKeyId: configData.oss_accessKeyId,
+            accessKeySecret: configData.oss_accessKeySecret,
+            // 填写Bucket名称。
+            bucket: configData.oss_bucketName,
+            timeout: 600000,
+          });
+          const res = await client.multipartUpload(filePath, fileChild, {
+            headers: headers,
+            // 设置并发上传的分片数量。
+            parallel: 4,
+            // 设置分片大小。默认值为1 MB，最小值为100 KB。
+            partSize: 1024 * 1024,
+            // headers,
+            mime: fileChild.type,
+          });
+          emit('uploadSuccess', {fileUrl:configData.oss_domain + res.name});
+            closeModal();
+        } catch (error) {
+          emit('uploadSuccess', {});
+        } finally {
+          setSubLoading(false);
+        }
+      };
       function handleClose(){
         src.value =''
         previewSource.value=''