InterviewRTC

Download Report

Transcript InterviewRTC

Interview WebRTC
Professor:
Elliot Eichen,
Mentor:
Aishwarya Srinivasan, [email protected]
Project Staff: Fu Yufei,
Li Wenzhao,
Lu Mingren,
Ma Huan,
Pang Mo,
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
Agenda
What is WebRTC
• Use case
• Advantages of WebRTC
• Why is WebRTC superior to Skype
Our project: Interview WebRTC
•
•
•
•
Project Output
Design idea and working flow
Key functions
Live Demo
Conclusion
Beauty of Interview WebRTC
A startup company plans to recruit Interns
x Flights
x Customized Skype
x Phone interview
Solution with WebRTC: Interview WebRTC





Free
No third party plugins
All you need is Internet and a Browser !!
High quality
Different signaling protocols can be chosen for handshake.
Check with this cool product!
For Interviewer
•
•
•
•
For Interviewee
•
•
•
Open the webpage we provide
Click the URL he received
Ping!
Enter our webpage
Create a unique URL
Send the URL via email
Ping!
Forget Skype!
With Skype, you cannot image:
 Light & convenient
− No installation
− Use the URL!
 Record the video
− Share with your boss
 Group interview
How is this powerful app realized
Firebase
Offerer
SDP
Answerer
SDP
Media Flow
Caller’s
Browser
ICE
Callee’s
Browser
ICE
ICE
STUN Server
ICE
.html
.html
.js
.js
Lab Server
.html
URL
Key function
n.getMedia = n.webkitGetUserMedia
|| n.mozGetUserMedia;
n.getMedia(options.constraints
{ audio: true, video: true }
Get User Media
function createOffer()
function createAnswer()
function sendsdp(sdp) {
sdp = JSON.stringify(sdp)};
Signaling & Exchange SDP
Peer to Peer Connection
peerConnection.onicecandidate
=onicecandidate;
var peerConnection = new PeerConne
ction(location.search.indexOf('turn=tr
ue') !== -1 ? TURN : STUN, optional);
Media Flow
Ready to Rock?!
Conclusion
• Introduction and advantages of WebRTC
• Use Case: Interview WebRTC
• Our project achievements
• The logic & function of Interview WebRTC
• Live demo
Thank you.