更新版本至 0.0.42，修改依赖项版本并在 QueryResources 类中新增 onProcess 回调以支持上传进度通知

query/query-resources/index.ts

@@ -2,15 +2,18 @@ import { adapter, DataOpts, Result } from '@kevisual/query';
 import path from 'path-browserify-esm';
 import { hashContent } from './utils';
 
+type Process = {}
 type QueryResourcesOptions = {
   prefix?: string;
   storage?: Storage;
   username?: string;
+  onProcess?: (opts?: Process) => void;
   [key: string]: any;
 };
 export class QueryResources {
   prefix: string; // root/resources
   storage: Storage;
+  onProcess?: (opts?: Process) => void;
   constructor(opts: QueryResourcesOptions) {
     if (opts.username) {
       this.prefix = `/${opts.username}/resources/`;
@@ -18,6 +21,7 @@ export class QueryResources {
       this.prefix = opts.prefix || '';
     }
     this.storage = opts.storage || localStorage;
+    this.onProcess = opts.onProcess || (() => { });
   }
   setUsername(username: string) {
     this.prefix = `/${username}/resources/`;
@@ -81,6 +85,7 @@ export class QueryResources {
       // 使用分块上传
       return this.uploadChunkedFile(filepath, content, hash, { chunkSize, ...restOpts });
     }
+    this.onProcess?.({ type: 'uploadBegin', filename, size: fileSize, process: 0 });
 
     const formData = new FormData();
     if (isBlob) {
@@ -88,7 +93,7 @@ export class QueryResources {
     } else {
       formData.append('file', new Blob([content], { type }));
     }
-    return adapter({
+    const res = await adapter({
       url: url.toString(),
       isPostFile: true,
       method: 'POST',
@@ -101,6 +106,8 @@ export class QueryResources {
         ...restOpts?.params,
       },
     });
+    this.onProcess?.({ type: 'uploadFinish', filename, size: fileSize, process: 100 });
+    return res;
   }
   async uploadChunkedFile(filepath: string, file: Blob, hash: string, opts?: DataOpts & { chunkSize?: number }): Promise<Result<any>> {
     const pathname = `${this.prefix}${filepath}`;
@@ -114,8 +121,10 @@ export class QueryResources {
     const { chunkSize: _chunkSize, ...restOpts } = opts || {};
     const chunkSize = _chunkSize ?? 5 * 1024 * 1024; // 5MB
     const totalChunks = Math.ceil(file.size / chunkSize);
+    this.onProcess?.({ type: 'uploadBegin', filename, size: file.size, process: 0 });
 
     for (let currentChunk = 0; currentChunk < totalChunks; currentChunk++) {
+      this.onProcess?.({ type: 'uploadChunkedFile', filename, size: file.size, process: 0, totalChunks, currentChunk: currentChunk + 1 });
       const start = currentChunk * chunkSize;
       const end = Math.min(start + chunkSize, file.size);
       const chunkBlob = file.slice(start, end);
@@ -145,15 +154,16 @@ export class QueryResources {
           },
         });
         if (res.code !== 200) {
-          throw new Error(`Chunk upload failed with code ${res!.code}, message: ${res!.message}`);
+          throw new Error(`Chunk 上传失败 code ${res!.code}, 错误信息是: ${res!.message}`);
         }
         console.log(`Chunk ${currentChunk + 1}/${totalChunks} uploaded`, res);
+        this.onProcess?.({ type: 'uploadChunkedFile', filename, size: file.size, process: Math.round(((currentChunk + 1) / totalChunks) * 100), totalChunks, currentChunk: currentChunk + 1 });
       } catch (error) {
         console.error(`Error uploading chunk ${currentChunk + 1}/${totalChunks}`, error);
         return { code: 500, message: `分块上传失败: ${(error as Error).message}` };
       }
     }
-
+    this.onProcess?.({ type: 'uploadFinish', filename, size: file.size, process: 100 });
     return { code: 200, message: '上传成功' };
   }