Isomorphic TypeScript file upload library for browser and node.js environments.
)
Quickstart:
npm install upload
# ...or
yarn add upload
Example usage
upload function
import { upload } from 'upload';
async function test() {
const response = await upload(
'https://example.com/upload',
{
file: someInput.file,
},
{
onProgress: progress => (element.innerText = progress * 100 + '%'),
}
);
console.log(response);
}Upload class
async function test() {
const upload = new Upload({
url: 'https://example.com/upload',
form: {
file: someInput.file,
},
headers: {
Authorization: 'Bearer TOKEN',
},
});
upload.on('progress', progress => {
element.innerText = progress * 100 + '%';
});
const response = await upload.upload();
console.log(response);
alert('Done!');
}Abort request
const upload = new Upload({
url: 'https://httpbin.org/post',
form: someInput.file,
});
upload.on('state', () => {
if (upload.state === 'aborted') doSomething();
});
upload.upload();
upload.abort();Events
You can attach event listeners to an instance of Upload with .on:
upload.on('state', state => {
console.log(state);
});state
Emitted when upload state is changed. Possible states: new, started, aborted, failed, successful.
error
Emitted when an error occurs.
progress (progress: number)
Emitted when upload progress changes. Progress is a float between 0 and 1.
API
interface UploadResponse {
data?: string | ArrayBuffer | Blob;
headers?: Record<string, string | string[] | undefined>;
}
interface UploadOptions {
form: Record<string, string | Blob> | FormData | FormDataNode;
url: string;
headers?: Record<string, string>;
}
type UploadState = 'new' | 'started' | 'aborted' | 'failed' | 'successful';
public state: UploadState;
public progress = 0;
public uploadedBytes = 0;
public totalBytes = 0;
new Upload(options: UploadOptions);
upload(): Promise<UploadResponse>;
abort(): void;
on(eventType: 'progress', listener: (progress: number) => void): void;
on(eventType: 'error', listener: () => void): void;
on(eventType: 'state', listener: (state: string) => void): void;
off(eventType: 'progress', listener: (progress: number) => void): void;
off(eventType: 'error', listener: () => void): void;
off(eventType: 'state', listener: (state: string) => void): void;