Uploading video files directly from user's browser to ByteArk Stream and Qoder
npm install @byteark/video-upload-sdkUploading video files directly from user's browser to ByteArk Stream
and ByteArk Qoder service.
⚠️ For users who are using Video Upload SDK v1.2.3 and earlier, please refer the Migration Guide for migrating to v1.3.0 and newer. ⚠️
For Yarn:
``
yarn add @byteark/video-upload-sdk
For npm:
`
npm install --save @byteark/video-upload-sdk
`ts
import { VideoUploadManager } from '@byteark/video-upload-sdk';
async function main() {
// Initialize the SDK
const uploadManager = new VideoUploadManager({
// SDK Options
serviceName: 'byteark.stream' | 'byteark.qoder',
serviceEndpoint:
'https://stream.byteark.com' | 'https://qoder.byteark.com/apps/
formId: '
formSecret: '
projectKey: '
overlayPresetId: 'overlayPresetId(Stream)',
// Callback Functions
onUploadProgress: (job: UploadJob, progress: UploadProgress) => {
// Called when video uploading has a progress.
},
onUploadCompleted: (job: UploadJob) => {
// Called when a video has uploaded.
},
onUploadFailed: (job: UploadJob, error: Error | DetailedError) => {
// Called when video uploading failed (cannot retry).
},
onVideosCreated: (videoKeys: string[]) => {
// Called after all videos are created on our service.
},
});
// An example use case
uploadManager.addUploadJobs(fileList);
await uploadManager.start();
}
main();
`
You are required to create a form upload to use this SDK. You will obtain formId and formSecret after creating the form.
- serviceName: Please use byteark.stream
- serviceEndpoint: An optional field, you can customize an endpoint here. A default value is
- formId: Please use your form upload's
- formSecret: Please use your form upload's
- projectKey: Please use the that you want to upload videos into. Please refer to this documentation to get your project key.overlayPresetId
- overlayPresetId: Please use the if you want to add an overlay to all videos uploaded through this form.
ByteArk Qoder is our legacy service. Please contact ByteArk admin for Qoder's appId and appSecret.
- serviceName: Please use byteark.qoder
- serviceEndpoint: An optional field, you can customize an endpoint here. A default value is
- formId: Please use
- formSecret: Please use
- projectKey: Please use the project's ID that you want to upload videos into.
| Name | Returns | Description |
| ----------------------- | ---------------------- | -------------------------------------------------------- |
| getJobQueue | UploadJob[] | Returns a job queue array. |
| getJobByUploadId | UploadJob \| undefined | Returns a job that matches the provided uploadId. |
| getIsUploadStarted | boolean | Returns true if any upload job has started. |
| getIsAllUploadCancelled | boolean | Returns true if all jobs in a queue have been cancelled. |
Add videos that you want to upload. The SDK will create videos from the inputted files, trigger "onVideosCreated" callback, and add them to a job queue.
#### Parameters
files can be FileList, File[], or VideoFileObject[] type.File
- You can simply use an array of or FileList to upload videos. Your video titles will be a name of the uploaded file.VideoFileObject
- You can use if you want to specify more details to your video. VideoFileObject is an object containing the following fields:file
- : Your video file.videoMetadata
- : An object containing any pair of string value, with no required fields. Example object fields are:title
- A title of your video.tags
- Tags of your video.useOverlayPreset
- : If you set overlayPresetId, you can send useOverlayPreset: true to mark that this video will use the overlay preset.
Set a new options to VideoUploadManager. This operation cannot be done when any upload job has already started.
Start uploading from a job queue.
Pause a job by the provided uploadId.
This method throws an error when a job with the provided uploadId cannot be found.
Resume a job by the provided uploadId.
This method throws an error when a job with the provided uploadId cannot be found.
Cancel a job by the provided uploadId.
This method throws an error when a job with the provided uploadId cannot be found.
Cancel all jobs in a job queue.
Triggers after all videos are created on our service, which will happen after calling addUploadJobs(files)` method.
Triggers after the first upload job started uploading.
Triggers periodically when upload job(s) are being uploaded.
Triggers after all upload jobs finished uploading.
Triggers when something happened while uploading and halted the uploader.
We have an example application in
- React: ./examples/video-upload-react/src/App.js.
This guide details the changes and how to change your code to migrate to Video Upload SDK version 1.3.