Update support for GCS resumable uploads with retries and signed URLs

Author: HarishKumar097

CHANGELOG.md

@@ -2,6 +2,15 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.0.2]
+- Implemented support for Google Cloud Storage resumable uploads and chunked client uploads.
+- Added retry mechanism with exponential backoff for GCS upload failures based on retryable status codes.
+- Enabled support for user-provided signed URLs, allowing resumable uploads to work with externally generated session URIs.
+- Updated the API endpoint from https://v1.fastpix.io/on-demand/uploads to https://api.fastpix.io/v1/on-demand/upload for obtaining signed URLs.
+
+## [1.0.1]
+- Update readme.md and license
+
 ## [1.0.0]
 
 ### Features:

README.md

@@ -4,7 +4,7 @@ This SDK helps you efficiently upload large files from the browser by splitting
 
 Please note that this SDK is designed to work only with FastPix and is not a general purpose uploads SDK.
 
-## Features:
+# Features:
 
 - **Chunking:** Files are automatically split into chunks (configurable, default size is 16MB/chunk).
 - **Pause and Resume:** Allows temporarily pausing the upload and resuming after a while.
@@ -13,84 +13,99 @@ Please note that this SDK is designed to work only with FastPix and is not a gen
 - **Error Handling and Reporting:** Comprehensive error handling to manage upload failures gracefully and inform users of issues.
 - **Customizability:** Developers can customize the chunk size and retry attempts based on their specific needs and network conditions.
 
-## Installation
+# Prerequisites:
 
-To install the SDK, you can use npm or your favourite node package manager 😉:
+## Getting started with FastPix:
+
+To get started with SDK, you will need a signed URL.
+
+To make API requests, you'll need a valid **Access Token** and **Secret Key**. See the [Basic Authentication Guide](https://docs.fastpix.io/docs/basic-authentication) for details on retrieving these credentials.
+
+Once you have your credentials, use the [Upload media from device](https://docs.fastpix.io/reference/direct-upload-video-media) API to generate a signed URL for uploading media.
+
+## Installation:
+
+To install the SDK, you can use NPM,  CDN, or your preferred package manager:
+
+### Using NPM:
 
 ```bash
 npm i @fastpix/resumable-uploads
 ```
 
-## Basic Usage
-
-To get started with SDK, you will need a signed URL. 
+### Using CDN:
 
-To make API requests, you'll need a valid **Access Token** and **Secret Key**. See the [Basic Authentication Guide](https://docs.fastpix.io/docs/basic-authentication) for details on retrieving these credentials.
+```bash
+<script src="https://cdn.jsdelivr.net/npm/@fastpix/resumable-uploads@latest/dist/uploads.js"></script>
+```
 
-Once you have your credentials, use the [Upload media from device](https://docs.fastpix.io/reference/direct-upload-video-media) API to generate a signed URL for uploading media.
+## Basic Usage
 
-**Import**
+## Import
 
 ```javascript
-import { Uploader } from "@fastpix/resumable-uploads"
+import { Uploader } from "@fastpix/resumable-uploads";
 ```
 
-**Integration**
+## Integration
 
 ```javascript
-const fileUploader = Uploader.init({
-    endpoint: 'https://example.com/signed-url', // Replace with the signed URL.
-    file: mediaFile, // Provide the media file you want to upload.
-    chunkSize: 5120, // Specify the chunk size in kilobytes (KB). Minimum allowed chunk size is 5120KB (5MB).
+try {
+  const fileUploader = Uploader.init({
+    endpoint: "https://example.com/signed-url", // Replace with the signed URL.
+    file: mediaFile, // Provide the media file you want to upload. From <input type="file" />
+    chunkSize: 5 * 1024, // Minimum allowed chunk size is 5120KB (5MB).
 
     // Additional optional parameters can be specified here as needed
-})
+  });
+} catch (error) {
+  // Handle initialization errors, such as invalid configuration or missing file
+  console.error("Failed to initialize uploads:", error?.message);
+}
 ```
 
-**Monitor the upload progress through lifecycle events**
+## Monitor the upload progress through lifecycle events
 
 ```javascript
-
 // Track upload progress
-fileUploader.on('progress', event => { 
-    console.log("Upload Progress:", event.detail); 
-}); 
+fileUploader.on("progress", (event) => {
+  console.log("Upload Progress:", event.detail.progress);
+});
 
 // Handle errors during the upload process
-fileUploader.on('error', event => { 
-    console.error("Upload Error:", event.detail.message); 
-}); 
+fileUploader.on("error", (event) => {
+  console.error("Upload Error:", event.detail.message);
+});
 
 // Trigger actions when the upload completes successfully
-fileUploader.on('success', event => { 
-    console.log("Upload Completed"); 
-}); 
+fileUploader.on("success", (event) => {
+  console.log("Upload Completed");
+});
 
 // Track the initiation of each chunk upload
-fileUploader.on('attempt', event => { 
-    console.log("Chunk Upload Attempt:", event.detail); 
-}); 
+fileUploader.on("chunkAttempt", (event) => {
+  console.log("Chunk Upload Attempt:", event.detail);
+});
 
 // Track failures of each chunk upload attempt
-fileUploader.on('chunkAttemptFailure', event => { 
-    console.log("Chunk Attempt Failure:", event.detail); 
-}); 
+fileUploader.on("chunkAttemptFailure", (event) => {
+  console.log("Chunk Attempt Failure:", event.detail);
+});
 
 // Perform an action when a chunk is successfully uploaded
-fileUploader.on('chunkSuccess', event => { 
-    console.log("Chunk Successfully Uploaded:", event.detail); 
-}); 
+fileUploader.on("chunkSuccess", (event) => {
+  console.log("Chunk Successfully Uploaded:", event.detail);
+});
 
 // Triggers when the connection is back online
-fileUploader.on('online', event => { 
-    console.log("Connection Online"); 
-}); 
+fileUploader.on("online", (event) => {
+  console.log("Connection Online");
+});
 
 // Triggers when the connection goes offline
-fileUploader.on('offline', event => { 
-    console.log("Connection Offline"); 
+fileUploader.on("offline", (event) => {
+  console.log("Connection Offline");
 });
-
 ```
 
 ## Managing Uploads
@@ -115,35 +130,46 @@ You can control the upload lifecycle with the following methods:
   fileUploader.abort(); // Abort the current upload
   ```
 
-
 ## Parameters Accepted
 
-This SDK supports the following parameters:
-
-
-- `endpoint` (required): 
-
-  The URL endpoint where the file will be uploaded.
-
-- `file` (required): 
-
-  The file object that you want to upload.
-
-- `chunkSize` (optional):
-
-  Size of each chunk in kilobytes (KB). Default is 16 MB (16384 KB), with a minimum of 5 MB (5120 KB) and a maximum of 500 MB (512000 KB).
-
-- `maxFileSize` (optional): 
-
-  The maximum file size allowed for upload, specified in kilobytes (KB). This helps prevent excessively large uploads.
-
-- `retryChunkAttempt` (optional):
+The upload function accepts the following parameters:
+
+| Name                | Type                                | Required | Description                                                                                                                                                   |
+| ------------------- | ----------------------------------- | -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `endpoint`          | `string` or `() => Promise<string>` | Required | The signed URL endpoint where the file will be uploaded. Can be a static string or a function returning a `Promise` that resolves to the upload URL.          |
+| `file`              | `File` or `Object`                  | Required | The file object to be uploaded. Typically a `File` retrieved from an `<input type="file" />` element, but can also be a generic object representing the file. |
+| `chunkSize`         | `number` (in KB)                    | Optional | Size of each chunk in kilobytes. Default is `16384` KB (16 MB).<br>**Minimum:** 5120 KB (5 MB), **Maximum:** 512000 KB (500 MB).                              |
+| `maxFileSize`       | `number` (in KB)                    | Optional | Maximum allowed file size for upload, specified in kilobytes. Files exceeding this limit will be rejected.                                                    |
+| `retryChunkAttempt` | `number`                            | Optional | Number of retry attempts per chunk in case of failure. Default is `5`.                                                                                        |
+| `delayRetry`        | `number` (in seconds)               | Optional | Delay between retry attempts after a failed chunk upload. Default is `1` second.                                                                              |
+
+### Example usage of integrating all parameters with `Uploader.init`
+
+```js
+// Get the selected file from the input
+const selectedFile = document.querySelector("#fileInput").files[0];
+
+try {
+  const fileUploader = Uploader.init({
+    endpoint: "https://example.com/signed-url", // Signed URL for uploading
+    file: selectedFile, // File or Object to upload
+    chunkSize: 10 * 1024, // 10 MB per chunk
+    maxFileSize: 100 * 1024, // 100 MB max file size
+    retryChunkAttempt: 6, // Retry each failed chunk up to 6 times
+    delayRetry: 2, // Wait 2 seconds between retry attempts
+  });
+} catch (error) {
+  // Handle initialization errors
+  console.error("Failed to initialize upload:", error?.message);
+}
+```
 
-  Number of retries per chunk in case of failure. Default is 5 retries.
+# References
  
-- `delayRetry` (optional):
-
-  Delay between retry attempts (in milliseconds) after a chunk upload fails. Default is 1000 ms.
+[FastPix Homepage](https://www.fastpix.io/)
+[FastPix Dashboard](https://dashboard.fastpix.io/)
+[Uploads github](https://github.com/FastPix/web-uploads-sdk)
+[API Reference](https://docs.fastpix.io/reference/on-demand-overview)
 
 # Detailed Usage: