sipFrame.html 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <meta name="applicable-device"content="mobile" /> 
  7. <!-- <script>
  8. var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
  9. CSS.supports('top: constant(a)'))
  10. document.write(
  11. '<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
  12. (coverSupport ? ', viewport-fit=cover' : '') + '" />')
  13. </script> -->
  14. <script src="./sdk1.js"></script>
  15. </head>
  16. <body>
  17. <!-- 媒体播放dom树 -->
  18. <audio id='remoteAudio' autoPlay></audio>
  19. <!-- <audio id='notifySound' autoPlay></audio> -->
  20. </body>
  21. <script>
  22. console.log("-----qxj iframe------");
  23. var _phone = null;
  24. var user = ''; // OPEN API放回
  25. var ha1 = ''; // OPEN API放回
  26. var realm = ''; // OPEN API放回
  27. // var user = '1010'; // OPEN API放回
  28. // var ha1 = 'e9cf8476ccdb5ab51b274e5ec4091cda'; // OPEN API放回
  29. // var realm = 'call.yjf.runtzh.com'; // OPEN API放回
  30. var server = 'call.yjf.runtzh.com'; // OPEN的IP地址和端口
  31. var mobile="";
  32. var sessionId='';
  33. JsSIP.C.SESSION_EXPIRES=120,JsSIP.C.MIN_SESSION_EXPIRES=360;
  34. var remoteAudio=document.getElementById('remoteAudio');
  35. // 事件处理
  36. function webphoneHandle(type, data, options) {
  37. console.log("qxj webphoneHandle type:"+type, "\n\n data:"+JSON.stringify(data), "\n\n options:"+JSON.stringify(options));
  38. // var outgoing="outgoing";
  39. // if(type=="outgoing.connecting"){
  40. // outgoing="connecting";
  41. // }
  42. // else if(type=="outgoing.progress"){
  43. // outgoing="progress";
  44. // }
  45. // else if(type=="outgoing.ended"){
  46. // outgoing="ended";
  47. // }
  48. sendData(type);
  49. }
  50. // 启动软电话
  51. function startPhone () {
  52. if(_phone==null){
  53. _phone = new WebPhoneSDK({
  54. lib: JsSIP,
  55. debug: true,
  56. debugLib: true,
  57. user: user,
  58. ha1: ha1,
  59. realm: realm,
  60. server: server,
  61. audioElement: document.getElementById('remoteAudio'),
  62. httpsConfirmFrame: 'httpsConfirmFrame',
  63. pcConfig:{"iceServers":[{"urls":["stun:211.159.161.254"]}]},
  64. events: {
  65. 'ua.connecting': (type, data) => webphoneHandle(type, data),
  66. 'ua.connected': (type, data) => webphoneHandle(type, data),//WEBPHONE链接OK
  67. 'ua.disconnected': (type, data) => webphoneHandle(type, data),//WEBPHONE链接断开
  68. 'reg.registered': (type, data) => webphoneHandle(type, data),//WEBPHONE 分机注册
  69. 'reg.unregistered': (type, data) => webphoneHandle(type, data),//WEBPHONE 分机取消注册
  70. 'reg.failed': (type, data) => webphoneHandle(type, data),//WEBPHONE 注册失败
  71. 'incoming.notify': (type, data, options) => this.webphoneHandle(type, data, options), //有电话进来了
  72. 'incoming.failed': (type, data, options) => this.webphoneHandle(type, data, options),//WEBPHONE 有电话进来,然后处理失败了(如,我们拒绝了,或者客户侧直接挂断了)
  73. 'incoming.ended': (type, options) => this.webphoneHandle(type, options),// WEBPHONE 有电话进来了,呼叫正常结束了
  74. 'incoming.accecpted': (type, options) => this.webphoneHandle(type, options),//有电话进来了,呼叫接听了
  75. 'outgoing.connecting': (type, options) => this.webphoneHandle(type, options),//WEBPHONE正在尝试呼出
  76. 'outgoing.progress': (type, options) => this.webphoneHandle(type, options),//WEBPHONE开始振铃了
  77. 'outgoing.failed': (type, data, options) => this.webphoneHandle(type, data, options),//WEBPHONE呼出失败了,如被叫拒绝了,线路异常呼出失败了
  78. 'outgoing.ended': (type, options) => this.webphoneHandle(type, options),//呼出正常结束
  79. 'outgoing.accecpted': (type, data, options) => this.webphoneHandle(type, data, options),//呼出被叫接听
  80. 'call.hold': (type, data) => webphoneHandle(type, data),//呼叫保持
  81. 'call.unhold': (type, data) => webphoneHandle(type, data)//呼叫解除保持
  82. }
  83. });
  84. }
  85. _phone.start({});
  86. }
  87. // 一定等到页面加载OK之后
  88. window.onload = function() {
  89. //startPhone();
  90. setVolume(0.5);
  91. }
  92. window.addEventListener('message', function (e) {
  93. console.log("qxj iframe getmsg:", JSON.stringify(e.data));
  94. if(e.data.act==0){ //初始化
  95. user=e.data.user;
  96. ha1=e.data.ha1;
  97. realm=e.data.realm;
  98. mobile=e.data.mobile;
  99. startPhone();
  100. }
  101. else if(e.data.act==1){ //呼叫
  102. sessionId=e.data.sessionId;
  103. callNumber();
  104. }
  105. else if(e.data.act==2){ //挂断
  106. hungUp();
  107. }
  108. else if(e.data.act==3){ //通话静音设置
  109. setMuted(true);
  110. }
  111. else if(e.data.act==4){ //音量设置
  112. setVolume(e.data.volume);
  113. }
  114. else if(e.data.act==5){ //恢复通话
  115. setMuted(false);
  116. }
  117. else if(e.data.act==6){ //关闭免提
  118. setVolume(e.data.volume);
  119. }
  120. else if(e.data.act==7){ //7 停用sdk
  121. stopPhone();
  122. }
  123. else if(e.data.act==8){ //8 重置phone
  124. stopPhone();
  125. _phone=null;
  126. }
  127. });
  128. //停用软电话
  129. function stopPhone(){
  130. _phone.stop();
  131. }
  132. // 发起呼叫
  133. function callNumber() {
  134. console.log("qxj callNumber sessionId:",sessionId);
  135. if (_phone) {
  136. _phone.call(mobile,{userdata:sessionId});
  137. }
  138. }
  139. function hungUp(){
  140. _phone.reject();
  141. }
  142. function setMuted(isMuted){
  143. console.log("isMuted",isMuted);
  144. remoteAudio.muted=isMuted;
  145. }
  146. function setVolume(volume){ //volume 属于是控制audio 播放音乐的音量,其范围0-1,1表示音量最大
  147. remoteAudio.volume =volume;
  148. }
  149. function sendData(type){ //将值传入uniapp页面
  150. //var param={data:type};
  151. window.parent.postMessage(type, '*');
  152. }
  153. </script>
  154. </html>