Can upload ISO files

virtweb_frontend/src/api/ApiClient.ts

@@ -1,5 +1,14 @@
 import { AuthApi } from "./AuthApi";
 
+interface RequestParams {
+  uri: string;
+  method: "GET" | "POST" | "DELETE" | "PATCH" | "PUT";
+  allowFail?: boolean;
+  jsonData?: any;
+  formData?: FormData;
+  progress?: (progress: number) => void;
+}
+
 interface APIResponse {
   data: any;
   status: number;
@@ -32,14 +41,8 @@ export class APIClient {
   /**
    * Perform a request on the backend
    */
-  static async exec(args: {
-    uri: string;
-    method: "GET" | "POST" | "DELETE" | "PATCH" | "PUT";
-    allowFail?: boolean;
-    jsonData?: any;
-    formData?: FormData;
-  }): Promise<APIResponse> {
-    let body = undefined;
+  static async exec(args: RequestParams): Promise<APIResponse> {
+    let body: string | undefined | FormData = undefined;
     let headers: any = {};
 
     // JSON request
@@ -53,31 +56,71 @@ export class APIClient {
       body = args.formData;
     }
 
-    const res = await fetch(this.backendURL() + args.uri, {
-      method: args.method,
-      body: body,
-      headers: headers,
-      credentials: "include",
-    });
+    const url = this.backendURL() + args.uri;
 
-    // Process response
     let data;
-    if (res.headers.get("content-type") === "application/json")
-      data = await res.json();
-    else data = await res.blob();
+    let status: number;
+
+    // Make the request with XMLHttpRequest
+    if (args.progress) {
+      const res: XMLHttpRequest = await new Promise((resolve, reject) => {
+        const xhr = new XMLHttpRequest();
+        xhr.upload.addEventListener("progress", (e) =>
+          args.progress!(e.loaded / e.total)
+        );
+        xhr.addEventListener("load", () => resolve(xhr));
+        xhr.addEventListener("error", () =>
+          reject(new Error("File upload failed"))
+        );
+        xhr.addEventListener("abort", () =>
+          reject(new Error("File upload aborted"))
+        );
+        xhr.addEventListener("timeout", () =>
+          reject(new Error("File upload timeout"))
+        );
+        xhr.open(args.method, url, true);
+        xhr.withCredentials = true;
+        for (const key in headers) {
+          if (headers.hasOwnProperty(key))
+            xhr.setRequestHeader(key, headers[key]);
+        }
+        xhr.send(body);
+      });
+
+      status = res.status;
+      if (res.responseType === "json") data = JSON.parse(res.responseText);
+      else data = res.response;
+    }
+
+    // Make the request with fetch
+    else {
+      const res = await fetch(url, {
+        method: args.method,
+        body: body,
+        headers: headers,
+        credentials: "include",
+      });
+
+      // Process response
+      if (res.headers.get("content-type") === "application/json")
+        data = await res.json();
+      else data = await res.blob();
+
+      status = res.status;
+    }
 
     // Handle expired tokens
-    if (res.status === 412) {
+    if (status === 412) {
       AuthApi.UnsetAuthenticated();
       window.location.href = "/";
     }
 
-    if (!args.allowFail && !res.ok)
-      throw new ApiError("Request failed!", res.status, data);
+    if (!args.allowFail && (status < 200 || status > 299))
+      throw new ApiError("Request failed!", status, data);
 
     return {
       data: data,
-      status: res.status,
+      status: status,
     };
   }
 }