api.video React Native video uploader module

api.video is the video infrastructure for product builders. Lightning fast video APIs for integrating, scaling, and managing on-demand & low latency live streaming features in your app.

Table of contents

• Table of contents
• Project description
• Getting started
  • Installation
  • Code sample
    • Regular upload
    • Progressive upload
  • Android
    • Permissions
    • Notifications
• Example
• Dependencies
• FAQ

Project description

This module is an easy way to upload video with delegated token to api.video

Getting started

Installation

npm install @api.video/react-native-video-uploader

or

yarn add @api.video/react-native-video-uploader

Code sample

Regular upload

import ApiVideoUploader from '@api.video/react-native-video-uploader';

ApiVideoUploader.uploadWithUploadToken('YOUR_UPLOAD_TOKEN', 'path/to/my-video.mp4')
  .then((value: Video) => {
   // Manages success here
  })
  .catch((e: any) => {
    // Manages error here
  });

Progressive upload

For more details about progressive uploads, see the progressive upload documentation.

import ApiVideoUploader from '@api.video/react-native-video-uploader';

(async () => {
  const uploadSession = ApiVideoUploader.createProgressiveUploadSession({token: 'YOUR_UPLOAD_TOKEN'});
  try {
    await session.uploadPart("path/to/video.mp4.part1");
    await session.uploadPart("path/to/video.mp4.part2");
    // ...
    const video = await session.uploadLastPart("path/to/video.mp4.partn");
    // ...
  } catch(e: any) {
    // Manages error here
  }
})();

Android

Permissions

Permissions android.permission.READ_MEDIA_VIDEO (for API 33+) or android.permission.READ_EXTERNAL_STORAGE (for API < 33) are in the library manifest and will be requested by this library at runtime. You don't have to request them in your application.

On Android 33+, the upload comes with a notification to show the progress. So if your application targets Android 33+, you might request android.permission.POST_NOTIFICATIONS permission at runtime.

When targeting Android API Level 34+, you must declare the service type in your application's manifest file. In your AndroidManifest.xml file, add the following lines in the <application> tag:

    <service
      android:name="androidx.work.impl.foreground.SystemForegroundService"
      android:exported="false"
      android:foregroundServiceType="dataSync" />

Notifications

To customize the notification to your own brand, you can change the icon, color or channel name by overwriting the following resources in your own application resources:

• the icon: R.drawable.ic_upload_notification
• the color: R.color.upload_notification_color
• the channel name: R.string.upload_notification_channel_name

Example

An example that demonstrates how to use the API is provided in folder example/.

To run the example:

• for Android: yarn && yarn example android
• for iOS: yarn && yarn example ios

Dependencies

api.video-reactnative-uploader is using external libraries.

Plugin	README
swift-video-uploader	swift-video-uploader
android-video-uploader	android-video-uploader

FAQ

If you have any questions, ask our community or use Issues.