Giter VIP home page Giter VIP logo

react-native-webrtc-firebase's Introduction

react native web-rtc firebase

Minimal react native web-etc example with Firebase

Read

This blog might help to understand the code : dipanshkhandelwal-medium-react-native-webrtc-firebase

Demo

Demo GIf

Steps to setup the project

  1. Clone the reposiotry git clone https://github.com/DipanshKhandelwal/react-native-webrtc-firebase.git

  2. Create a new firebase project https://console.firebase.google.com/

  3. Add new apps in the firebase console

  4. Add firebase config to the apps.

    • For Android:

      • Download the google-services.json and add it to this path android/app/
    • For ios:

      • Download the GoogleService-Info.plist and add it to your ios project using xcode
  5. In the firebase console remember to create a new Firestore database and keep it's rules to test mode.

  6. Go to the project folder, and run the following command.

    • yarn install
  7. Build the app:

    • For Android

      • yarn run android
    • For ios

      • yarn run cocoapods
      • yarn run ios

Steps to run

Take a look at the demo for understanding the steps better.

  • Enter Room Id.

  • Caller

    • Call Screen
    • Start Call
  • Callee

    • Join Screen
    • Join Call
  • Stop Call

react-native-webrtc-firebase's People

Contributors

dependabot[bot] avatar dipanshkhandelwal avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

react-native-webrtc-firebase's Issues

Join Room Doesn't work

Hi, Just tried your code, added mine Plist file, App is successfully connecting with Firestore also.
but when I try to join the call, nothing happens. Any idea what's gone wrong. using it in two real iPhones and all permissions are in place.

Checked:
Firebase - working
Permissions - Working

Unable to show face of the user who joins

I have tried your code there's some Issue with it
exampe
User A => Starts Call
User B => Joins Call
User A Can see User B steam but
User B Can't see User A stream even after adding IceCandidates of User A
can you please fix it

Error installing the app

I would like to try your project but I can't go through yarn android, I did all instructions successfully then after that I tried to start the emulator but there's error installing the app. What could be the solution for this?

> Task :app:processDebugGoogleServices FAILED
Parsing json file: E:\Download 2nd\00 Developer Sites\sample-templates\react-native-web> root project > Resolve files of :classpath > gradle-api-3.6.2.jar
rtc-firebase-master\android\app\google-services.json
41 actionable tasks: 41 executed
Note: E:\Download 2nd\00 Developer Sites\sample-templates\react-native-webrtc-firebase-
master\node_modules\@react-native-firebase\app\android\src\reactnative\java\io\invertas
e\firebase\app\ReactNativeFirebaseAppInitProvider.java uses or overrides a deprecated A
PI.
Note: Recompile with -Xlint:deprecation for details.
Note: E:\Download 2nd\00 Developer Sites\sample-templates\react-native-webrtc-firebase-
master\node_modules\react-native-webrtc\android\src\main\java\com\oney\WebRTCModule\Pee
rConnectionObserver.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
Note: E:\Download 2nd\00 Developer Sites\sample-templates\react-native-webrtc-firebase-
master\node_modules\react-native-webrtc\android\src\main\java\com\oney\WebRTCModule\Pee
rConnectionObserver.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:processDebugGoogleServices'.
> No matching client found for package name 'com.webrtc_firebase'

* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option 
to get more log output. Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 4m 38s

error Failed to install the app. Make sure you have the Android development environment
 set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag fo
r more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081    
Note: E:\Download 2nd\00 Developer Sites\sample-templates\react-native-webrtc-firebase-
master\node_modules\@react-native-firebase\app\android\src\reactnative\java\io\invertas
e\firebase\app\ReactNativeFirebaseAppInitProvider.java uses or overrides a deprecated A
PI.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. 

Failed to add ICE candidate

Getting following issues in the build when tried

  1. Failed to add ICE candidate
  2. Failed to set remote answer sdp: called in wrong state: kStable

Getting err while making build

Task :app:installDebug FAILED
Skipping device 'HUAWEI SCL-U31 - 5.1.1' for 'app:debug': minSdkVersion [24] > deviceApiLevel [22]
108 actionable tasks: 90 executed, 18 up-to-date
Note: C:\Users\Dell\Desktop\react-native-webrtc-firebase\node_modules@react-native-firebase\app\android\src\reactnative\java\io\invertase\firebase\app\ReactNativeFirebaseAppInitProvider.java uses or overrides
a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: C:\Users\Dell\Desktop\react-native-webrtc-firebase\node_modules\react-native-webrtc\android\src\main\java\com\oney\WebRTCModule\WebRTCModule.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: Some input files use unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
Note: C:\Users\Dell\Desktop\react-native-webrtc-firebase\android\app\src\debug\java\com\webrtc_firebase\ReactNativeFlipper.java uses or overrides a deprecated API.
Note: Recompile with -Xlint:deprecation for details.

Bug when trying to join call

I keep getting this error when trying to join call and the callee collection is never created in the respective rooms in firestore database. On iOS. On android once i try to join call the app closes.

Possible Unhandled Promise Rejection (id: 0):
Object {
"message": "SessionDescription is NULL.",
"name": "SetRemoteDescriptionFailed",
}
JSON value '{
}' of type NSMutableDictionary cannot be converted to .sdp must not be null

in metro this comes up as an error:

Possible Unhandled Promise Rejection (id: 0):
Object {
  "message": "SessionDescription is NULL.",
  "name": "SetRemoteDescriptionFailed",
}

The callee collection also never gets created in the respective rooms in firestore database.

Sample of sdp written to database

_sdp: v=0o=- 765269967391877801 2 IN IP4 127.0.0.1s=-t=0 0a=group:BUNDLE audio videoa=msid-semantic: WMS a3a6a14c-980f-4052-a881-e53290c2e9a8m=video 100c=IN IP4 0.0.0.0a=rtcp:9 IN IP4 0.0.0.0a=ice-ufrag:qfEea=ice-pwd:aMtS7ouM3ykOCV6z7jx0hhlSa=ice-options:trickle renominationa=fingerprint:sha-256 01:13:79:2E:BA:E3:67:9A:77:66:90:00:D7:62:BA:31:2C:48:FC:EB:8C:21:22:7E:5B:9D:0E:71:82:5F:63:5Aa=setup:actpassa=mid:audioa=extmap:1 urn:ietf:params:rtp-hdrext:ssrc-audio-levela=extmap:2 http://www.webrtc.org/experiments/rtp-hdrext/abs-send-timea=extmap:3 http://www.ietf.org/id/draft-holmer-rmcat-transport-wide-cc-extensions-01a=sendrecva=rtcp-muxa=rtpmap:111 opus/48000/2a=rtcp-fb:111 transport-cca=fmtp:111 minptime=10;useinbandfec=1a=rtpmap:103 ISAC/16000a=rtpmap:9 G722/8000a=rtpmap:102 ILBC/8000a=rtpmap:0 PCMU/8000a=rtpmap:8 PCMA/8000a=rtpmap:105 CN/16000a=rtpmap:13 CN/8000a=rtpmap:110 telephone-event/48000a=rtpmap:113 telephone-event/16000a=rtpmap:126 telephone-event/8000a=ssrc:866776128 cname:OXEDL0qxAsrhPmB7a=ssrc:866776128 msid:a3a6a14c-980f-4052-a881-e53290c2e9a8 256a9ac0-8163-45b5-ae52-0ece88651c51a=ssrc:866776128 mslabel:a3a6a14c-980f-4052-a881-e53290c2e9a8a=ssrc:866776128 label:256a9ac0-8163-45b5-ae52-0ece88651c51m=video 9 UDP/TLS/RTP/SAVPF 96 97 98 99 100 101 127c=IN IP4 0.0.0.0a=rtcp:9 IN IP4 0.0.0.0a=ice-ufrag:qfEea=ice-pwd:aMtS7ouM3ykOCV6z7jx0hhlSa=ice-options:trickle renominationa=fingerprint:sha-256 01:13:79:2E:BA:E3:67:9A:77:66:90:00:D7:62:BA:31:2C:48:FC:EB:8C:21:22:7E:5B:9D:0E:71:82:5F:63:5Aa=setup:actpassa=mid:videoa=extmap:14 urn:ietf:params:rtp-hdrext:toffseta=extmap:2 http://www.webrtc.org/experiments/rtp-hdrext/abs-send-timea=extmap:13 urn:3gpp:video-orientationa=extmap:3 http://www.ietf.org/id/draft-holmer-rmcat-transport-wide-cc-extensions-01a=extmap:5 http://www.webrtc.org/experiments/rtp-hdrext/playout-delaya=extmap:6 http://www.webrtc.org/experiments/rtp-hdrext/video-content-typea=extmap:7 http://www.webrtc.org/experiments/rtp-hdrext/video-timinga=extmap:8 http://www.webrtc.org/experiments/rtp-hdrext/color-spacea=sendrecva=rtcp-muxa=rtcp-rsizea=rtpmap:96 VP8/90000a=rtcp-fb:96 goog-remba=rtcp-fb:96 transport-cca=rtcp-fb:96 ccm fira=rtcp-fb:96 nacka=rtcp-fb:96 nack plia=rtpmap:97 rtx/90000a=fmtp:97 apt=96a=rtpmap:98 VP9/90000a=rtcp-fb:98 goog-remba=rtcp-fb:98 transport-cca=rtcp-fb:98 ccm fira=rtcp-fb:98 nacka=rtcp-fb:98 nack plia=rtpmap:99 rtx/90000a=fmtp:99 apt=98a=rtpmap:100 red/90000a=rtpmap:101 rtx/90000a=fmtp:101 apt=100a=rtpmap:127 ulpfec/90000a=ssrc-group:FID 2850853975 3259115858a=ssrc:2850853975 cname:OXEDL0qxAsrhPmB7a=ssrc:2850853975 msid:a3a6a14c-980f-4052-a881-e53290c2e9a8 3f3952f6-cd3d-4d3e-a2dc-81eda77cf516a=ssrc:2850853975 mslabel:a3a6a14c-980f-4052-a881-e53290c2e9a8a=ssrc:2850853975 label:3f3952f6-cd3d-4d3e-a2dc-81eda77cf516a=ssrc:3259115858 cname:OXEDL0qxAsrhPmB7a=ssrc:3259115858 msid:a3a6a14c-980f-4052-a881-e53290c2e9a8 3f3952f6-cd3d-4d3e-a2dc-81eda77cf516a=ssrc:3259115858 mslabel:a3a6a14c-980f-4052-a881-e53290c2e9a8a=ssrc:3259115858 label:3f3952f6-cd3d-4d3e-a2dc-81eda77cf516

More than 2 participans

Hey Dipansh (i hope i call you right), you have really GREAT job, thats awesome documentation, anyway do you know how to make every room have more than 2 participants?

Thanks a lot.
Haksa

Audio is not working

I have just clone your project but audio is not working.
Please help as quick as possible

All permission are given

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.