whep.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. var pc = null;
  2. function negotiate() {
  3. var host = window.location.hostname
  4. pc.addTransceiver('video', { direction: 'recvonly' });
  5. pc.addTransceiver('audio', { direction: 'recvonly' });
  6. return pc.createOffer().then((offer) => {
  7. return pc.setLocalDescription(offer);
  8. }).then(() => {
  9. // wait for ICE gathering to complete
  10. return new Promise((resolve) => {
  11. if (pc.iceGatheringState === 'complete') {
  12. resolve();
  13. } else {
  14. const checkState = () => {
  15. if (pc.iceGatheringState === 'complete') {
  16. pc.removeEventListener('icegatheringstatechange', checkState);
  17. resolve();
  18. }
  19. };
  20. pc.addEventListener('icegatheringstatechange', checkState);
  21. }
  22. });
  23. }).then(() => {
  24. var offer = pc.localDescription;
  25. return fetch("http://"+host+":1985/rtc/v1/whep/?app=live&stream=livestream", {
  26. body: offer.sdp,
  27. headers: {
  28. 'Content-Type': 'application/sdp'
  29. },
  30. method: 'POST'
  31. });
  32. }).then((response) => {
  33. console.log(response)
  34. return response.data;
  35. }).then((answer) => {
  36. return pc.setRemoteDescription({sdp:answer,type:'answer'});
  37. }).catch((e) => {
  38. alert(e);
  39. });
  40. }
  41. function start() {
  42. var config = {
  43. sdpSemantics: 'unified-plan'
  44. };
  45. if (document.getElementById('use-stun').checked) {
  46. config.iceServers = [{ urls: ['stun:stun.l.google.com:19302'] }];
  47. }
  48. pc = new RTCPeerConnection(config);
  49. // connect audio / video
  50. pc.addEventListener('track', (evt) => {
  51. if (evt.track.kind == 'video') {
  52. document.getElementById('video').srcObject = evt.streams[0];
  53. } else {
  54. document.getElementById('audio').srcObject = evt.streams[0];
  55. }
  56. });
  57. document.getElementById('start').style.display = 'none';
  58. negotiate();
  59. document.getElementById('stop').style.display = 'inline-block';
  60. }
  61. function stop() {
  62. document.getElementById('stop').style.display = 'none';
  63. // close peer connection
  64. setTimeout(() => {
  65. pc.close();
  66. }, 500);
  67. }