Last active
August 31, 2020 21:34
-
-
Save stephenlb/edd4b0c218a72a34349baa004a80fd7a to your computer and use it in GitHub Desktop.
WebRTC on localhost and HTTPS answer for StackOverflow http://stackoverflow.com/a/41969170/524733 - you must run an HTTPS server even on localhost.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<form id='loginForm'> | |
<input id='username' placeholder='Pick a username!' /> | |
<input type='submit' value='Log In'> | |
</form> | |
<form id='callForm'> | |
<input id='number' placeholder='Enter user to dial!' /> | |
<input type='submit' value='Call'/> | |
</form> | |
<form id='hangupForm'> | |
<input type='submit' value='Hangup'> | |
</form> | |
<div id='vid-box'></div> | |
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> | |
<script src='https://cdn.pubnub.com/pubnub.js'></script> | |
<script src='https://stephenlb.github.io/webrtc-sdk/js/webrtc.js'></script> | |
<script>(function(){ | |
let phone = null; | |
const vidbox = $('#vid-box'); | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
// Form Login | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
$('#loginForm').submit( event => { | |
if (phone) phone.hangup(); | |
else phone = PHONE({ | |
number : $('#username').val() || 'Anonymous' | |
, ssl : true | |
, publish_key : 'pub-c-655853ec-bdb3-434f-9b37-8a2557301b1c' | |
, subscribe_key : 'sub-c-197667e6-e806-11e6-a5f4-02ee2ddab7fe' | |
}); | |
phone.debug( info => { console.log(info) } ); | |
phone.unable( error => { alert('unable to connect') } ); | |
phone.ready( session => { | |
$('#username').css( 'background', '#55ff5b' ); | |
} ); | |
phone.receive(function(session){ | |
session.ended( session => { vidbox.html('') } ); | |
session.connected( session => { | |
vidbox.append(session.video); | |
}); | |
}); | |
return false; | |
} ); | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
// Form Call | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
$('#callForm').submit( event => { | |
if (!window.phone) alert('Login First!'); | |
else phone.dial($('#number').val()); | |
return false; | |
} ); | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
// Form Hangup | |
// =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= | |
$('#hangupForm').submit( event => { | |
if (phone) phone.hangup(); | |
return false; | |
} ); | |
})();</script> | |
</html> |
Author
stephenlb
commented
Jan 31, 2017
Don't work more :(
yes, it didn't work. it's alwys show login first, and i've already login
@andhicapratama, I do agree. Why?
line 52, add:
window.phone = phone;
This code is not working. please provide alternate solution.
i have already add "window.phone=phone" in line 52, login issue resolved but video calling is not working
thank you but i want use this application without internet pleas help me.
internet required for this to work. a STUN server is in use.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment