视频聊天功能-开发中

im-ui/src/components/chat/ChatPrivateVideo.vue

@@ -2,10 +2,7 @@
 	<el-dialog :title="title" :visible.sync="visible" width="800px" :before-close="handleClose">
 		<div class="chat-video">
 			<div class="chat-video-box">
-				<div class="chat-video-friend" 
+				<div class="chat-video-friend" v-loading="loading" element-loading-text="等待对方接听..." element-loading-spinner="el-icon-loading"
-					v-loading="loading" 
-					element-loading-text="等待对方接听..." 
-					element-loading-spinner="el-icon-loading"
 				 element-loading-background="rgba(0, 0, 0, 0.9)">
 					<video ref="friendVideo" autoplay=""></video>
 				</div>
@@ -15,8 +12,10 @@
 			</div>
 			<div class="chat-video-controllbar">
 
-				<div v-show="state=='CONNECTING'" title="取消呼叫" class="icon iconfont icon-phone-reject reject" style="color: red;" @click="cancel()"></div>
+				<div v-show="state=='CONNECTING'" title="取消呼叫" class="icon iconfont icon-phone-reject reject" style="color: red;"
-				<div v-show="state=='CONNECTED'" title="挂断" class="icon iconfont icon-phone-reject reject" style="color: red;" @click="handup()"></div>
+				 @click="cancel()"></div>
+				<div v-show="state=='CONNECTED'" title="挂断" class="icon iconfont icon-phone-reject reject" style="color: red;"
+				 @click="handup()"></div>
 
 			</div>
 		</div>
@@ -50,30 +49,10 @@
 				candidates: [],
 				configuration: {
 					iceServers: [{
-							"urls": navigator.mozGetUserMedia ? "stun:stun.services.mozilla.com" : navigator.webkitGetUserMedia ?
+						'urls': 'turn:www.boxim.online:3478',
-								"stun:stun.l.google.com:19302" : "stun:23.21.150.121"
+						'credential': "admin",
-						},
+						'username': "admin123"
-						{urls: "stun:stun.l.google.com:19302"},
+					}]
-						{urls: "stun:stun1.l.google.com:19302"},
-						{urls: "stun:stun2.l.google.com:19302"},
-						{urls: "stun:stun3.l.google.com:19302"},
-						{urls: "stun:stun4.l.google.com:19302"},
-						{urls: "stun:23.21.150.121"},
-						{urls: "stun:stun01.sipphone.com"},
-						{urls: "stun:stun.ekiga.net"},
-						{urls: "stun:stun.fwdnet.net"},
-						{urls: "stun:stun.ideasip.com"},
-						{urls: "stun:stun.iptel.org"},
-						{urls: "stun:stun.rixtelecom.se"},
-						{urls: "stun:stun.schlund.de"},
-						{urls: "stun:stunserver.org"},
-						{urls: "stun:stun.softjoys.com"},
-						{urls: "stun:stun.voiparound.com"},
-						{urls: "stun:stun.voipbuster.com"},
-						{urls: "stun:stun.voipstunt.com"},
-						{urls: "stun:stun.voxgratia.org"},
-						{urls: "stun:stun.xten.com"}
-					]
 				}
 			}
 		},
@@ -155,6 +134,7 @@
 						this.peerConnection.addTrack(track, stream);
 					});
 				}
+				this.peerConnection.IceConnectionStateChange
 			},
 			handleMessage(msg) {
 				if (msg.type == this.$enums.MESSAGE_TYPE.RTC_ACCEPT) {
@@ -317,6 +297,7 @@
 
 			.chat-video-friend {
 				height: 600px;
+
 				video {
 					width: 100%;
 					height: 100%;
@@ -340,6 +321,7 @@
 			display: flex;
 			justify-content: space-around;
 			padding: 10px;
+
 			.icon {
 				font-size: 50px;
 				cursor: pointer;