📹 Live stream RTMP publisher for React Native with built in camera support!
### ⚠️🛠️ Support for [the new architecture](https://reactnative.dev/docs/the-new-architecture/landing-page) is under development
## Installation
```sh
npm install react-native-rtmp-publisher
```
or
```sh
yarn add react-native-rtmp-publisher
```
and for iOS
```sh
cd ios && pod install
```
## Android
Add Android Permission for camera and audio to `AndroidManifest.xml`
```xml
```
## iOS
Add iOS Permission for camera and audio to `Info.plist`
```xml
NSCameraUsageDescription
CAMERA PERMISSION DESCRIPTION
NSMicrophoneUsageDescription
AUDIO PERMISSION DESCRIPTION
```
Implement these changes to `AppDelegate.m` (or `AppDelegate.mm`)
```objc
#import
// <-- Add this import
..
..
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
..
..
..
..
// <-- Add this section -->
AVAudioSession *session = AVAudioSession.sharedInstance;
NSError *error = nil;
if (@available(iOS 10.0, *)) {
[session
setCategory:AVAudioSessionCategoryPlayAndRecord
mode:AVAudioSessionModeVoiceChat
options:AVAudioSessionCategoryOptionDefaultToSpeaker|AVAudioSessionCategoryOptionAllowBluetooth
error:&error];
} else {
SEL selector = NSSelectorFromString(@"setCategory:withOptions:error:");
NSArray * optionsArray =
[NSArray arrayWithObjects:
[NSNumber numberWithInteger:AVAudioSessionCategoryOptionAllowBluetooth],
[NSNumber numberWithInteger:AVAudioSessionCategoryOptionDefaultToSpeaker], nil];
[session
performSelector:selector
withObject: AVAudioSessionCategoryPlayAndRecord
withObject: optionsArray
];
[session
setMode:AVAudioSessionModeVoiceChat
error:&error
];
}
[session
setActive:YES
error:&error
];
// <-- Add this section -->
return YES;
}
```
## Example Project
Clone the repo and run
```sh
yarn
```
and
```sh
cd example && yarn ios (or yarn android)
```
You can use Youtube for live stream server. You can check [Live on Youtube](https://support.google.com/youtube/answer/2474026?hl=tr&ref_topic=9257984)
## Usage
```js
import RTMPPublisher from 'react-native-rtmp-publisher';
// ...
async function publisherActions() {
await publisherRef.current.startStream();
await publisherRef.current.stopStream();
await publisherRef.current.mute();
await publisherRef.current.unmute();
await publisherRef.current.switchCamera();
await publisherRef.current.getPublishURL();
await publisherRef.current.isMuted();
await publisherRef.current.isStreaming();
await publisherRef.current.toggleFlash();
await publisherRef.current.hasCongestion();
await publisherRef.current.isAudioPrepared();
await publisherRef.current.isVideoPrepared();
await publisherRef.current.isCameraOnPreview();
await publisherRef.current.setAudioInput(audioInput: AudioInputType);
}
...}
onConnectionStartedRtmp={() => ...}
onConnectionSuccessRtmp={() => ...}
onDisconnectRtmp={() => ...}
onNewBitrateRtmp={() => ...}
onStreamStateChanged={(status: streamState) => ...}
/>
```
## Props
| Name | Type | Required | Description |
| :----------: | :------: | :------: | :-----------------------------------: |
| `streamURL` | `string` | `true` | Publish URL address with RTM Protocol |
| `streamName` | `string` | `true` | Stream name or key |
### Youtube Example
For live stream, Youtube gives you stream url and stream key, you can place the key on `streamName` parameter
**Youtube Stream URL:** `rtmp://a.rtmp.youtube.com/live2`
**Youtube Stream Key:** `****-****-****-****-****`
```js
` | Starts the stream | ✅ | ✅ |
| `stopStream` | `Promise` | Stops the stream | ✅ | ✅ |
| `mute` | `Promise` | Mutes the microphone | ✅ | ✅ |
| `unmute` | `Promise` | Unmutes the microphone | ✅ | ✅ |
| `switchCamera` | `Promise` | Switches the camera | ✅ | ✅ |
| `toggleFlash` | `Promise` | Toggles the flash | ✅ | ✅ |
| `getPublishURL` | `Promise` | Gets the publish URL | ✅ | ✅ |
| `isMuted` | `Promise` | Returns microphone state | ✅ | ✅ |
| `isStreaming` | `Promise` | Returns streaming state | ✅ | ✅ |
| `hasCongestion` | `Promise` | Returns if congestion | ✅ | ❌ |
| `isAudioPrepared` | `Promise` | Returns audio prepare state | ✅ | ✅ |
| `isVideoPrepared` | `Promise` | Returns video prepare state | ✅ | ✅ |
| `isCameraOnPreview` | `Promise` | Returns camera is on | ✅ | ❌ |
| `setAudioInput` | `Promise`| Sets microphone input | ✅ | ✅ |
## Types
| Name | Value |
| ------------------------- | :--------------------------------------------------:|
| `streamState` | `CONNECTING`, `CONNECTED`, `DISCONNECTED`, `FAILED` |
| `BluetoothDeviceStatuses` | `CONNECTING`, `CONNECTED`, `DISCONNECTED` |
| `AudioInputType` | `BLUETOOTH_HEADSET`, `SPEAKER`, `WIRED_HEADSET` |
* AudioInputType: WIRED_HEADSET type supporting in only iOS. On Android it affects nothing. If a wired headset connected to Android device, device uses it as default.
## Used Native Packages
- Android: [rtmp-rtsp-stream-client-java](https://github.com/pedroSG94/rtmp-rtsp-stream-client-java) [2.2.2]
- iOS: [HaishinKit.swift](https://github.com/shogo4405/HaishinKit.swift) [1.2.7]
## Contributing
See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.
## License
MIT