WebRTC Video Chat Procedure Now that we have Firebase set up, let’s talk a little about how WebRTC can be used to set up a video chat. Say we have two computers, yours and your friend’s. Here is the step-by-step procedure needed to make the video chat work. (Note that I bolded words that sound strange, but are actually just JavaScript objects in JSON. I’ll give you examples of each right after these steps.)
- Display a MediaStream video of yourself on your computer
- Display a MediaStream video of your friend on his computer
- Create a PeerConnection on your computer
- Create a PeerConnection on your friend’s computer
- Create an Offer on your computer
- Add that Offer to the PeerConnection on your computer
- Send that Offer to your friend’s computer
- Add that Offer to the PeerConnection on your friend’s computer
- Generate ICE Candidates on your computer
- Send those ICE Candidates to your friend’s computer
- Add ICE Candidates to the PeerConnection on your friend’s computer
- Create an Answer on your friend’s computer
- Add that Answer to the PeerConnection on your friend’s computer
- Send that Answer to your computer
- Add that Answer to the PeerConnection on your computer
- Generate ICE Candidates on your friend’s computer
- Send those ICE Candidates to your computer
- Add ICE Candidates to the PeerConnection on your computer
- Display a MediaStream video of your friend on your computer
- Display a MediaStream video of yourself on your friend’s computer