React Native FFmpeg !GitHub release 

FFmpeg for React Native

Not maintained anymore, superseded by FFmpegKit. See ReactNativeFFmpeg to FFmpegKit Migration Guide.

$3

- Based on MobileFFmpeg
- Includes both FFmpeg and FFprobe
- Supports
- Both Android and iOS
- FFmpeg v4.1, v4.2, v4.3 and v4.4-dev releases
- arm-v7a, arm-v7a-neon, arm64-v8a, x86 and x86_64 architectures on Android
- Android API Level 16 or later
- armv7, armv7s, arm64, arm64e, i386 and x86_64 architectures on iOS
- iOS SDK 9.3 or later
- 25 external libraries

fontconfig, freetype, fribidi, gmp, gnutls, kvazaar, lame, libaom, libass, libiconv, libilbc, libtheora, libvorbis, libvpx, libwebp, libxml2, opencore-amr, opus, shine, snappy, soxr, speex, twolame, vo-amrwbenc, wavpack

- 4 external libraries with GPL license

vid.stab, x264, x265, xvidcore

- Concurrent execution
- zlib and MediaCodec Android system libraries
- bzip2, iconv, libuuid, zlib system libraries and AudioToolbox, VideoToolbox, AVFoundation system frameworks

- Includes Typescript definitions
- Licensed under LGPL 3.0, can be customized to support GPL v3.0

$3

$ yarn add react-native-ffmpeg

#### 2.1 Android

On React Native < 0.60, manually link the module by running the following command.

$ react-native link react-native-ffmpeg

#### 2.2 iOS

##### 2.2.1 Basic

On React Native >= 0.60,

- Add use_native_modules! to your Podfile and run pod install

On React Native < 0.60,

- Add react-native-ffmpeg pod to your Podfile and run pod install

``
pod 'react-native-ffmpeg', :podspec => '../node_modules/react-native-ffmpeg/react-native-ffmpeg.podspec'
`

- DO NOT USE react-native link on iOS. react-native link breaks Cocoapods dependencies.

#### 2.3 Packages

ffmpeg includes built-in encoders for some popular formats. However, there are certain external libraries that needs
to be enabled in order to encode specific formats/codecs. For example, to encode an mp3 file you need lame or
shine library enabled. You have to install a react-native-ffmpeg package that has at least one of them inside.
To encode an h264 video, you need to install a package with x264 inside. To encode vp8 or vp9 videos, you need
a react-native-ffmpeg package with libvpx inside.

react-native-ffmpeg provides eight packages that include different sets of external libraries. These packages are
named according to the external libraries included in them. Below you can see which libraries are enabled in each
package.

	min	min-gpl	https	https-gpl	audio	video	full	full-gpl
external libraries	-	vid.stab x264 x265 xvidcore	gmp gnutls	gmp gnutls vid.stab x264 x265 xvidcore	lame libilbc libvorbis opencore-amr opus shine soxr speex twolame vo-amrwbenc wavpack	fontconfig freetype fribidi kvazaar libaom libass libiconv libtheora libvpx libwebp snappy	fontconfig freetype fribidi gmp gnutls kvazaar lame libaom libass libiconv libilbc libtheora libvorbis libvpx libwebp libxml2 opencore-amr opus shine snappy soxr speex twolame vo-amrwbenc wavpack	fontconfig freetype fribidi gmp gnutls kvazaar lame libaom libass libiconv libilbc libtheora libvorbis libvpx libwebp libxml2 opencore-amr opus shine snappy soxr speex twolame vid.stab vo-amrwbenc wavpack x264 x265 xvidcore
android system libraries	zlib MediaCodec
ios system libraries	zlib AudioToolbox AVFoundation iconv VideoToolbox bzip2

Installation of react-native-ffmpeg using instructions in 2.1 and 2.2 enables the default package, which is based on https package.
It is possible to enable other installed packages using the following steps.

##### 2.3.1 Android

- Edit android/build.gradle file and define package name in ext.reactNativeFFmpegPackage variable.

`
ext {
reactNativeFFmpegPackage = ""
}

`

##### 2.3.2 iOS

- Edit ios/Podfile file and add package name as subspec. After that run pod install again.

`
pod 'react-native-ffmpeg/', :podspec => '../node_modules/react-native-ffmpeg/react-native-ffmpeg.podspec'
`

- Note that if you have use_native_modules! in your Podfile, specifying a subspec may cause the following error.
You can fix it by defining react-native-ffmpeg dependency before use_native_modules! in your Podfile.

`
[!] There are multiple dependencies with different sources for react-native-ffmpeg in Podfile:

- react-native-ffmpeg (from ../node_modules/react-native-ffmpeg)
- react-native-ffmpeg/ (from ../node_modules/react-native-ffmpeg/react-native-ffmpeg.podspec)
`

##### 2.3.3 Package Names

The following table shows all package names defined for react-native-ffmpeg.

| Package | Main Release | LTS Release |
| :----: | :----: | :----: |
| min | min | min-lts |
| min-gpl | min-gpl | min-gpl-lts |
| https | https | https-lts |
| https-gpl | https-gpl | https-gpl-lts |
| audio | audio | audio-lts |
| video | video | video-lts |
| full | full | full-lts |
| full-gpl | full-gpl | full-gpl-lts |

#### 2.4 LTS Release

react-native-ffmpeg is published in two different variants: Main Release and LTS Release. Both releases share the
same source code but is built with different settings. Below you can see the differences between the two.

In order to install the LTS variant, install the https-lts package using instructions in 2.3 or append -lts to
the package name you are using.

| | Main Release | LTS Release |
| :----: | :----: | :----: |
| Android API Level | 24 | 16 |
| Android Camera Access | Yes | - |
| Android Architectures | arm-v7a-neon
arm64-v8a
x86
x86-64 | arm-v7a
arm-v7a-neon
arm64-v8a
x86
x86-64 |
| Xcode Support | 10.1 | 7.3.1 |
| iOS SDK | 11.0 | 9.3 |
| iOS AVFoundation | Yes | - |
| iOS Architectures | arm64
x86-64
x86-64-mac-catalyst | armv7
arm64
i386
x86-64 |

$3

1. Execute synchronous FFmpeg commands.

- Use execute() method with a single command

`
import { LogLevel, RNFFmpeg } from 'react-native-ffmpeg';

RNFFmpeg.execute('-i file1.mp4 -c:v mpeg4 file2.mp4').then(result => console.log(FFmpeg process exited with rc=${result}.));
`

- Use executeWithArguments() method with an array of arguments

`
import { LogLevel, RNFFmpeg } from 'react-native-ffmpeg';

RNFFmpeg.executeWithArguments(["-i", "file1.mp4", "-c:v", "mpeg4", "file2.mp4"]).then(result => console.log(FFmpeg process exited with rc=${result}.));
`

2. Execute asynchronous FFmpeg commands.

`
import { LogLevel, RNFFmpeg } from 'react-native-ffmpeg';

RNFFmpeg.executeAsync('-i file1.mp4 -c:v mpeg4 file2.mp4', completedExecution => {
if (completedExecution.returnCode === 0) {
console.log("FFmpeg process completed successfully");
} else {
console.log(FFmpeg process failed with rc=${completedExecution.returnCode}.);
}
}).then(executionId => console.log(Async FFmpeg process started with executionId ${executionId}.));
`

3. Execute FFprobe commands.

- Use execute() method with a single command

`
import { LogLevel, RNFFprobe } from 'react-native-ffmpeg';

RNFFprobe.execute('-i file1.mp4').then(result => console.log(FFprobe process exited with rc=${result}.));
`

- Use executeWithArguments() method with an array of arguments

`
import { LogLevel, RNFFprobe } from 'react-native-ffmpeg';

RNFFprobe.executeWithArguments(["-i", "file1.mp4"]).then(result => console.log(FFmpeg process exited with rc=${result}.));
`

4. Check execution output. Zero represents successful execution, non-zero values represent failure.
`
RNFFmpegConfig.getLastReturnCode().then(returnCode => {
console.log(Last return code: ${returnCode});
});

RNFFmpegConfig.getLastCommandOutput().then(output => {
console.log(Last command output: ${output});
});
`

5. Stop ongoing FFmpeg operations. Note that these two functions do not wait for termination to complete and return immediately.
- Stop all executions
`
RNFFmpeg.cancel();
`
- Stop a specific execution
`
RNFFmpeg.cancelExecution(executionId);
`

6. Get media information for a file.
- Print all fields
`
RNFFprobe.getMediaInformation('').then(information => {
console.log('Result: ' + JSON.stringify(information));
});
`
- Print selected fields
`
RNFFprobe.getMediaInformation('').then(information => {
if (information.getMediaProperties() !== undefined) {
if (information.getMediaProperties().filename !== undefined) {
console.log(Path: ${information.getMediaProperties().filename});
}
if (information.getMediaProperties().format_name !== undefined) {
console.log(Format: ${information.getMediaProperties().format_name});
}
if (information.getMediaProperties().bit_rate !== undefined) {
console.log(Bitrate: ${information.getMediaProperties().bit_rate});
}
if (information.getMediaProperties().duration !== undefined) {
console.log(Duration: ${information.getMediaProperties().duration});
}
if (information.getMediaProperties().start_time !== undefined) {
console.log(Start time: ${information.getMediaProperties().start_time});
}
if (information.getMediaProperties().nb_streams !== undefined) {
console.log(Number of streams: ${information.getMediaProperties().nb_streams.toString()});
}
let tags = information.getMediaProperties().tags;
if (tags !== undefined) {
Object.keys(tags).forEach((key) => {
console.log(Tag: ${key}:${tags[key]});
});
}

let streams = information.getStreams();
if (streams !== undefined) {
for (let i = 0; i < streams.length; ++i) {
let stream = streams[i];
console.log("---");
if (stream.getAllProperties().index !== undefined) {
console.log(Stream index: ${stream.getAllProperties().index.toString()});
}
if (stream.getAllProperties().codec_type !== undefined) {
console.log(Stream type: ${stream.getAllProperties().codec_type});
}
if (stream.getAllProperties().codec_name !== undefined) {
console.log(Stream codec: ${stream.getAllProperties().codec_name});
}
}
}
}
});
`

7. Enable log callback and redirect all FFmpeg/FFprobe logs to a console/file/widget.
`
logCallback = (log) => {
this.appendLog(${log.executionId}:${log.message});
};
...
RNFFmpegConfig.enableLogCallback(this.logCallback);
`

8. Enable statistics callback and follow the progress of an ongoing FFmpeg operation.
`
statisticsCallback = (statistics) => {
console.log(Statistics; executionId: ${statistics.executionId}, video frame number: ${statistics.videoFrameNumber}, video fps: ${statistics.videoFps}, video quality: ${statistics.videoQuality}, size: ${statistics.size}, time: ${statistics.time}, bitrate: ${statistics.bitrate}, speed: ${statistics.speed});
};
...
RNFFmpegConfig.enableStatisticsCallback(this.statisticsCallback);
`

9. Poll statistics without implementing statistics callback.
`
RNFFmpegConfig.getLastReceivedStatistics().then(statistics => console.log('Stats: ' + JSON.stringify(statistics)));
`

10. List ongoing executions.
`
RNFFmpeg.listExecutions().then(executionList => {
executionList.forEach(execution => {
console.log(Execution id is ${execution.executionId});
console.log(Execution start time is + new Date(execution.startTime));
console.log(Execution command is ${execution.command});
});
});
`

11. Set log level.
`
RNFFmpegConfig.setLogLevel(LogLevel.AV_LOG_WARNING);
`

12. Register your own fonts by specifying a custom fonts directory, so they are available to use in FFmpeg filters. Please note that this function can not work on relative paths, you need to provide full file system path.
- Without any font name mappings
`
RNFFmpegConfig.setFontDirectory('', null);
`
- Apply custom font name mappings. This functionality is very useful if your font name includes ' ' (space) characters in it.
`
RNFFmpegConfig.setFontDirectory('', { my_easy_font_name: "my complex font name" });
`

13. Use your own fontconfig configuration.
`
RNFFmpegConfig.setFontconfigConfigurationPath('');
`

14. Disable log functionality of the library. Logs will not be printed to console and log callback will be disabled.
`
RNFFmpegConfig.disableLogs();
`

15. Disable statistics functionality of the library. Statistics callback will be disabled but the last received statistics data will be still available.
`
RNFFmpegConfig.disableStatistics();
`

16. Create new FFmpeg pipe.
`
RNFFmpegConfig.registerNewFFmpegPipe().then(pipe => {
console.log("New ffmpeg pipe: " + pipe1);
});
`

$3

You can see how react-native-ffmpeg is used inside an application by running test application provided under the
react-native-ffmpeg-test repository. It supports command
execution, video encoding, accessing https, encoding audio, burning subtitles, video stabilisation, pipe operations
and concurrent command execution.

$3

Apply provided solutions if you encounter one of the following issues.

- react-native-ffmpeg uses file system paths, it does not know what an assets folder or a project folder is. So you can't use resources on those folders directly, you need to provide full paths of those resources.


- If react-native-ffmpeg release builds on Android fail with the following exception, make sure that mavenCentral() is
defined as a repository in your build.gradle and it is listed before jcenter().

`
I/ReactNativeJS: Loading react-native-ffmpeg.
I/mobile-ffmpeg: Loading mobile-ffmpeg.
E/mobile-ffmpeg: OnLoad thread failed to GetStaticMethodID for log.
java_vm_ext.cc:577] JNI DETECTED ERROR IN APPLICATION: JNI NewGlobalRef called with pending exception java.lang.NoSuchMethodError: no static method "Lcom/arthenica/mobileffmpeg/Config;.log(JI[B)V"
java_vm_ext.cc:577] at java.lang.String java.lang.Runtime.nativeLoad(java.lang.String, java.lang.ClassLoader, java.lang.Class) (Runtime.java:-2)
java_vm_ext.cc:577] at java.lang.String java.lang.Runtime.nativeLoad(java.lang.String, java.lang.ClassLoader) (Runtime.java:1131)
java_vm_ext.cc:577] at void java.lang.Runtime.loadLibrary0(java.lang.ClassLoader, java.lang.Class, java.lang.String) (Runtime.java:1085)
java_vm_ext.cc:577] at void java.lang.Runtime.loadLibrary0(java.lang.Class, java.lang.String) (Runtime.java:1008)
java_vm_ext.cc:577] at void java.lang.System.loadLibrary(java.lang.String) (System.java:1664)
java_vm_ext.cc:577] at void com.arthenica.mobileffmpeg.Config.() (:-1)
java_vm_ext.cc:577] at void com.arthenica.mobileffmpeg.Config.c(com.arthenica.mobileffmpeg.h) (:-1)
java_vm_ext.cc:577] at void com.arthenica.reactnative.RNFFmpegModule.enableLogEvents() (:-1)
java_vm_ext.cc:577] at java.lang.Object java.lang.reflect.Method.invoke(java.lang.Object, java.lang.Object[]) (Method.java:-2)
java_vm_ext.cc:577] at void com.facebook.react.bridge.JavaMethodWrapper.invoke(com.facebook.react.bridge.JSInstance, com.facebook.react.bridge.ReadableArray) (:-1)
java_vm_ext.cc:577] at void com.facebook.react.bridge.JavaModuleWrapper.invoke(int, com.facebook.react.bridge.ReadableNativeArray) (:-1)
java_vm_ext.cc:577] at void com.facebook.react.bridge.queue.NativeRunnable.run() (:-2)
java_vm_ext.cc:577] at void android.os.Handler.handleCallback(android.os.Message) (Handler.java:938)
java_vm_ext.cc:577] at void android.os.Handler.dispatchMessage(android.os.Message) (Handler.java:99)
java_vm_ext.cc:577] at void com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(android.os.Message) (:-1)
java_vm_ext.cc:577] at void android.os.Looper.loop() (Looper.java:223)
java_vm_ext.cc:577] at void com.facebook.react.bridge.queue.MessageQueueThreadImpl$4.run() (:-1)
java_vm_ext.cc:577] at void java.lang.Thread.run() (Thread.java:923)
java_vm_ext.cc:577]
java_vm_ext.cc:577] in call to NewGlobalRef
java_vm_ext.cc:577] from java.lang.String java.lang.Runtime.nativeLoad(java.lang.String, java.lang.ClassLoader, java.lang.Class)
`

- Enabling ProGuard on releases older than v0.3.3 causes linking errors. Please add the following rule inside your proguard-rules.pro file to preserve necessary method names and prevent linking errors.

`
-keep class com.arthenica.mobileffmpeg.Config {
native ;
void log(int, byte[]);
void statistics(int, float, float, long , int, double, double);
}
`

- ffmpeg requires a valid fontconfig configuration to render subtitles. Unfortunately, Android does not include a default fontconfig configuration.
So if you do not register a font or specify a fontconfig configuration under Android, then the burning process will not produce any errors but subtitles won't be burned in your file.
You can overcome this situation by registering a font using RNFFmpeg.setFontDirectory method or specifying your own fontconfig configuration using RNFFmpeg.setFontconfigConfigurationPath method.

- By default, Xcode compresses PNG files during packaging. If you use .png files in your commands make sure you set the following two settings to NO. If one of them is set to YES, your operations may fail with Error while decoding stream #0:0: Generic error in an external library error.



- Sometimes react-native run-ios fails with weird build errors. Execute the following commands and try again.

`
rm -rf ios/Pods ios/build ios/Podfile.lock
cd ios
pod install
`

- Add "postinstall": "sed -i '' 's\/#import \/#import \"RCTValueAnimatedNode.h\"\/' ./node_modules/react-native/Libraries/NativeAnimation/RCTNativeAnimatedNodesManager.h"
line to the scripts section of your package.json as recommended in react-native issue # 13198,
if your build receives the following error for iOS.

`
../node_modules/react-native/Libraries/NativeAnimation/RCTNativeAnimatedNodesManager.h:10:9: fatal error: 'RCTAnimation/RCTValueAnimatedNode.h' file not found
#import
^~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1 error generated.
`

- When pod install fails with the following message, delete the Podfile.lock file and run pod install again.

`
[!] Unable to find a specification for 'react-native-ffmpeg'.
`

- If react-native link is used for iOS, build may fail with the error below. Running pod install again fixes this issue.

`
../node_modules/react-native-ffmpeg/ios/Pods/Target Support Files/Pods-ReactNativeFFmpeg/Pods-ReactNativeFFmpeg.debug.xcconfig: unable to open file (in target "ReactNativeFFmpeg" in project "ReactNativeFFmpeg") (in target 'ReactNativeFFmpeg')
`

- On React Native < 0.60, using cocoapods for iOS dependency management may produce duplicate symbols for libReact.a and libyoga.a.
Add the following block to your Podfile and run pod install again.

`
post_install do |installer|
installer.pods_project.targets.each do |target|
targets_to_ignore = %w(React yoga)
if targets_to_ignore.include? target.name
target.remove_from_project
end
end
end

`

- Some react-native-ffmpeg packages include libc++_shared.so native library. If a second library which also includes libc++_shared.so is added as a dependency, gradle fails with More than one file was found with OS independent path 'lib/x86/libc++_shared.so' error message.

You can fix this error by adding the following block into your build.gradle.
`
android {
packagingOptions {
pickFirst 'lib/x86/libc++_shared.so'
pickFirst 'lib/x86_64/libc++_shared.so'
pickFirst 'lib/armeabi-v7a/libc++_shared.so'
pickFirst 'lib/arm64-v8a/libc++_shared.so'
}
}
`

$3

Refer to Changelog for updates.

$3

This project is licensed under the LGPL v3.0. However, if installation is customized to use a package with -gpl
postfix (min-gpl, https-gpl, full-gpl) then ReactNativeFFmpeg is subject to the GPL v3.0 license.

In test application; embedded fonts are licensed under the
SIL Open Font License, other digital assets are published in the public
domain.

$3

It is not clearly explained in their documentation, but it is believed that FFmpeg, kvazaar, x264 and x265
include algorithms which are subject to software patents. If you live in a country where software algorithms are
patentable then you'll probably need to pay royalty fees to patent holders. We are not lawyers though, so we recommend
that you seek legal advice first. See FFmpeg Patent Mini-FAQ.

$3

Feel free to submit issues or pull requests.

Please note that master branch includes only the latest released source code. Changes planned for the next release
are implemented under the development branch. Therefore, if you want to create a pull request, please open it against
the development`.

$3

- FFmpeg
- Mobile FFmpeg Wiki
- FFmpeg License and Legal Considerations