Add retries

Author: olivier-lando

dist/index.js

@@ -1,8 +1,15 @@
+interface OptionsWithUploadToken extends Options {
+    uploadToken: string;
+}
+interface OptionsWithAccessToken extends Options {
+    accessToken: string;
+    videoId: string;
+}
 interface Options {
     file: File;
-    uploadToken: string;
     chunkSize?: number;
-    uploadEndpoint?: string;
+    apiHost?: string;
+    retries?: number;
 }
 interface UploadProgressEvent {
     loaded: number;
@@ -12,17 +19,18 @@ export declare class VideoUploader {
     private file;
     private chunkSize;
     private uploadEndpoint;
-    private uploadToken;
     private currentChunk;
     private chunksCount;
     private fileSize;
     private fileName;
     private videoId?;
+    private retries;
     private onProgressCallbacks;
-    constructor(options: Options);
+    private headers;
+    constructor(options: OptionsWithAccessToken | OptionsWithUploadToken);
     onProgress(cb: () => UploadProgressEvent): void;
     upload(): Promise<any>;
-    private validateOptions;
+    private sleep;
     private createFormData;
     private uploadCurrentChunk;
 }

dist/src/index.d.ts

@@ -34,7 +34,8 @@
     "tslint": "^6.1.3",
     "typescript": "^4.0.2",
     "webpack": "^4.44.1",
-    "webpack-cli": "^3.3.12"
+    "webpack-cli": "^3.3.12",
+    "xhr-mock": "^2.5.1"
   },
   "dependencies": {
     "core-js": "^3.8.3"

package-lock.json

@@ -1,8 +1,15 @@
+interface OptionsWithUploadToken extends Options {
+    uploadToken: string;
+}
+interface OptionsWithAccessToken extends Options {
+    accessToken: string;
+    videoId: string;
+}
 interface Options {
     file: File;
-    uploadToken: string;
     chunkSize?: number;
-    uploadEndpoint?: string;
+    apiHost?: string;
+    retries?: number;
 }
 
 interface UploadProgressEvent {
@@ -11,25 +18,46 @@ interface UploadProgressEvent {
 }
 
 const DEFAULT_CHUNK_SIZE = 1024 * 1024; // 1mb
-const DEFAULT_UPLOAD_ENDPOINT = "https://ws.api.video/upload";
+const DEFAULT_RETRIES = 5;
+const DEFAULT_API_HOST = "ws.api.video";
 
 export class VideoUploader {
     private file: File;
     private chunkSize: number;
     private uploadEndpoint: string;
-    private uploadToken: string;
     private currentChunk: number = 0;
     private chunksCount: number;
     private fileSize: number;
     private fileName: string;
     private videoId?: string;
+    private retries: number;
     private onProgressCallbacks: ((e: UploadProgressEvent) => void)[] = [];
+    private headers: { [name: string]: string } = {};
+
+    constructor(options: OptionsWithAccessToken | OptionsWithUploadToken) {
+        const apiHost = options.apiHost || DEFAULT_API_HOST;
+
+        if (!options.file) {
+            throw new Error("'file' is missing");
+        }
+
+        if (options.hasOwnProperty("uploadToken")) {
+            const optionsWithUploadToken = options as OptionsWithUploadToken;
+            this.uploadEndpoint = `https://${apiHost}/upload?token=${optionsWithUploadToken.uploadToken}`;
+
+        } else if (options.hasOwnProperty("accessToken")) {
+            const optionsWithAccessToken = options as OptionsWithAccessToken;
+            if (!optionsWithAccessToken.videoId) {
+                throw new Error("'videoId' is missing");
+            }
+            this.uploadEndpoint = `https://${apiHost}/videos/${optionsWithAccessToken.videoId}/source`;
+            this.headers.Authorization = `Bearer ${optionsWithAccessToken.accessToken}`;
+        } else {
+            throw new Error(`You must provide either an accessToken or an uploadToken`);
+        }
 
-    constructor(options: Options) {
-        this.validateOptions(options);
         this.chunkSize = options.chunkSize || DEFAULT_CHUNK_SIZE;
-        this.uploadEndpoint = options.uploadEndpoint || DEFAULT_UPLOAD_ENDPOINT;
-        this.uploadToken = options.uploadToken;
+        this.retries = options.retries || DEFAULT_RETRIES;
         this.file = options.file;
         this.fileSize = this.file.size;
         this.fileName = this.file.name;
@@ -44,20 +72,30 @@ export class VideoUploader {
     public upload(): Promise<any> {
         return new Promise(async (resolve, reject) => {
             let response;
+            let retriesCount = 0;
             while (this.currentChunk < this.chunksCount) {
-                response = await this.uploadCurrentChunk();
-                this.videoId = response.videoId;
-                this.currentChunk++;
+                try {
+                    response = await this.uploadCurrentChunk();
+                    this.videoId = response.videoId;
+                    this.currentChunk++;
+
+                } catch (e) {
+                    if(retriesCount >= this.retries) {
+                        reject(e);
+                        break;
+                    }
+                    await this.sleep(200 + retriesCount * 500);
+                    retriesCount++;
+                }
             }
             resolve(response);
         });
     }
 
-    private validateOptions(options: Options) {
-        const required = ['file', 'uploadToken']
-        required.forEach(r => {
-            if (!(options as any)[r]) throw new Error(`"${r}" is missing`);
-        });
+    private sleep(duration: number): Promise<void> {
+        return new Promise((resolve, reject) => {
+            setTimeout(() => resolve(), duration);
+        })
     }
 
     private createFormData(startByte: number, endByte: number): FormData {
@@ -78,10 +116,22 @@ export class VideoUploader {
 
             const contentRange = `bytes ${firstByte}-${lastByte - 1}/${this.fileSize}`;
 
-            const xhr = new XMLHttpRequest();
-            xhr.open("POST", `${this.uploadEndpoint}?token=${this.uploadToken}`, true);
+            const xhr = new window.XMLHttpRequest();
+            xhr.open("POST", `${this.uploadEndpoint}`, true);
             xhr.setRequestHeader("Content-Range", contentRange);
-
+            for (const headerName of Object.keys(this.headers)) {
+                xhr.setRequestHeader(headerName, this.headers[headerName]);
+            }
+            xhr.onreadystatechange = (e) => {
+                if (xhr.readyState === 4) { // DONE
+                    if (xhr.status >= 400) {
+                        reject({
+                            status: xhr.status,
+                            message: xhr.response
+                        });
+                    }
+                }
+            };
             xhr.onload = (e) => resolve(JSON.parse(xhr.response));
             xhr.onprogress = (e) => this.onProgressCallbacks.forEach(cb => cb({
                 loaded: e.loaded + firstByte,