Skip to content

izquiratops/rn-rtmp-friend

Β 
Β 

Repository files navigation

github/issues github/issues-pr npm

Android

Add Android Permission for camera and audio to AndroidManifest.xml

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />

iOS

Add iOS Permission for camera and audio to Info.plist

<key>NSCameraUsageDescription</key>
 <string>CAMERA PERMISSION DESCRIPTION</string>
<key>NSMicrophoneUsageDescription</key>
 <string>AUDIO PERMISSION DESCRIPTION</string>

Usage

import RTMPPublisher from 'react-native-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);
}

<RTMPPublisher
  ref={publisherRef}
  streamURL="rtmp://your-publish-url"
  streamName="stream-name"
  videoSettings={{
    width: 1080,
    height: 1920,
    bitrate: 5000 * 1024,
    audioBitrate: 192 * 1000
  }}
  allowedVideoOrientations={[
    "portrait",
    "landscapeLeft",
    "landscapeRight",
    "portraitUpsideDown"
  ]}
  videoOrientation="portrait"
  onConnectionFailed={() => ...}
  onConnectionStarted={() => ...}
  onConnectionSuccess={() => ...}
  onDisconnect={() => ...}
  onNewBitrate={() => ...}
  onStreamStateChanged={(status: streamState) => ...}
/>

Props

Name Type Required Description
streamURL string true Publish URL address with RTMP Protocol
streamName string true Stream name or key
videoSettings VideoSettingsType false Video settings for video
allowedVideoOrientations VideoOrientation[] false Allowed video orientation
videoOrientation VideoOrientation false Initial video orientation

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: ****-****-****-****-****

<RTMPPublisher
  streamURL="rtmp://a.rtmp.youtube.com/live2"
  streamName="****-****-****-****-****"
  ...
  ...

Events

Name Returns Description Android iOS
onConnectionFailed null Invokes on connection fails to publish URL βœ… βœ…
onConnectionStarted null Invokes on connection start to publish URL βœ… βœ…
onConnectionSuccess null Invokes on connection success to publish URL βœ… βœ…
onDisconnect null Invokes on disconnect from publish URL βœ… βœ…
onNewBitrateReceived null Invokes on new bitrate received from URL βœ… ❌
onStreamStateChanged StreamState Invokes on stream state changes. It can be use alternatively for above connection events. βœ… βœ…
onBluetoothDeviceStatusChanged BluetoothDeviceStatuses Invokes on bluetooth headset state changes. βœ… ❌

Methods

Name Returns Description Android iOS
startStream Promise<void> Starts the stream βœ… βœ…
stopStream Promise<void> Stops the stream βœ… βœ…
mute Promise<void> Mutes the microphone βœ… βœ…
unmute Promise<void> Unmutes the microphone βœ… βœ…
switchCamera Promise<void> Switches the camera βœ… βœ…
toggleFlash Promise<void> Toggles the flash βœ… βœ…
getPublishURL Promise<string> Gets the publish URL βœ… βœ…
isMuted Promise<boolean> Returns microphone state βœ… βœ…
isStreaming Promise<boolean> Returns streaming state βœ… βœ…
hasCongestion Promise<boolean> Returns if congestion βœ… ❌
isAudioPrepared Promise<boolean> Returns audio prepare state βœ… βœ…
isVideoPrepared Promise<boolean> Returns video prepare state βœ… βœ…
isCameraOnPreview Promise<boolean> Returns camera is on βœ… ❌
setAudioInput Promise<AudioInputType> Sets microphone input βœ… βœ…
setVideoSettings Promise<VideoSettingsType> Sets camera quality settings βœ… βœ…

Types

Name Value
streamState CONNECTING, CONNECTED, DISCONNECTED, FAILED
BluetoothDeviceStatuses CONNECTING, CONNECTED, DISCONNECTED
AudioInputType BLUETOOTH_HEADSET, SPEAKER, WIRED_HEADSET
VideoSettingsType {width: number; height: number; bitrate: number; audioBitrate: number}
VideoOrientation portrait, landscapeLeft, landscapeRight, portraitUpsideDown
  • 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.

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

About

πŸ“Ή Live stream RTMP Publisher for React Native

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • Java 39.4%
  • Swift 28.7%
  • TypeScript 19.6%
  • Objective-C 8.7%
  • Ruby 1.2%
  • Makefile 1.1%
  • Other 1.3%