clay: 代码开始处理

This commit is contained in:
clay 2023-04-30 20:55:29 +08:00
parent f7c86eceae
commit 140c6cbc7c
4 changed files with 61 additions and 121 deletions

View File

@ -24,6 +24,7 @@
"@vue/cli-service": "~5.0.0", "@vue/cli-service": "~5.0.0",
"@vue/eslint-config-standard": "^6.1.0", "@vue/eslint-config-standard": "^6.1.0",
"sass": "^1.32.7", "sass": "^1.32.7",
"axios": "^0.24.0",
"sass-loader": "^12.0.0" "sass-loader": "^12.0.0"
} }
} }

View File

@ -16,7 +16,7 @@
<el-avatar :size="50" :src="head" class="head"/> <el-avatar :size="50" :src="head" class="head"/>
<div class="left"> <div class="left">
<div v-if="!userChange" @click="userChange = true" class="name">{{ user.nickName }}</div> <div v-if="!userChange" @click="userChange = true" class="name">{{ user.nickName }}</div>
<el-input v-if="userChange" placeholder="请输入昵称" @blur="blurChange" v-model="user.nickName" class="inputName" <el-input v-if="userChange" placeholder="请输入昵称" v-model="user.nickName" class="inputName"
@keyup.enter="sendMsg"></el-input> @keyup.enter="sendMsg"></el-input>
<div v-if="user.state" class="online">Online</div> <div v-if="user.state" class="online">Online</div>
<div v-if="!user.state" class="onclose">OnClose</div> <div v-if="!user.state" class="onclose">OnClose</div>
@ -60,6 +60,7 @@
<script> <script>
import head from '../assets/head.png' import head from '../assets/head.png'
import {ElMessage} from 'element-plus' import {ElMessage} from 'element-plus'
import axios from 'axios'
export default { export default {
data() { data() {
@ -74,7 +75,6 @@ export default {
head: head, head: head,
inputValue: '', inputValue: '',
websocket: { websocket: {
// url: "ws://chatapi.odliken.cn/websocket/",
url: 'ws://localhost:8000/netty-ws/ws', url: 'ws://localhost:8000/netty-ws/ws',
type: 'primary', type: 'primary',
data: '' data: ''
@ -98,10 +98,6 @@ export default {
connect(num, type) { connect(num, type) {
this.websocket.type = 'success' this.websocket.type = 'success'
let url = this.websocket.url; let url = this.websocket.url;
// if (type == 1) {
// // url = url + "?userId=" + num + "&token=token"
// url = url + "?userId=1681478908550&token=token"
// }
this.webSock = new WebSocket(url) this.webSock = new WebSocket(url)
// //
this.webSock.onmessage = this.webSocketOnMessage this.webSock.onmessage = this.webSocketOnMessage
@ -113,31 +109,14 @@ export default {
this.webSock.onclose = this.webSocketClose this.webSock.onclose = this.webSocketClose
}, },
// //
webSocketOnOpen() { webSocketOnOpen() {
this.user.state = false
this.webSock.send(JSON.stringify({ this.webSock.send(JSON.stringify({
type: "auth", type: "auth",
id:1681478908550, id: 1681478908550,
message:1681478908550 message: 1681478908550
})) }))
// PingWebSocketFrame
// this.pingTimer = setInterval(() => {
// this.webSock.send(JSON.stringify({
// type: "ping"
// }))
// }, 5000)
//
this.start()
this.blurChange()
//send
//
// let actions = {
// 'room': '007854ce7b93476487c7ca8826d17eba',
// 'info': '1121212'
// }
// this.webSocketSend(JSON.stringify(actions))
}, },
// //
webSocketOnError() { webSocketOnError() {
@ -146,39 +125,34 @@ export default {
}, },
// todo // todo
webSocketOnMessage(e) { webSocketOnMessage(e) {
// console.log(e.data) console.log(e.data)
// console.log('') console.log('接受数据')
// let data = null let data = null
// try { try {
// data = JSON.parse(e.data) data = JSON.parse(e.data)
// if (null != data) { if (null != data) {
// this.processData(data) // this.processData(data)
// } }
// } catch (e) { } catch (e) {
// console.log(e) console.log(e)
// } }
// console.log(data, 'data')
// if (!data.none){
// }
//
this.reset()
}, },
// //
processData(data) { processData(data) {
if (data.type == 1) { if (data.type === 1) {
console.log(data) console.log(data)
this.addUserInfo(data.data) this.addUserInfo(data.data)
console.log(this.asideList) console.log(this.asideList)
} else if (data.type == 2) { } else if (data.type === 2) {
this.asideList = [] this.asideList = []
for (let item of data.data) { for (let item of data.data) {
this.addUserInfo(item) this.addUserInfo(item)
} }
} else if (data.type == 3) { } else if (data.type === 3) {
this.removeUser(data.data.userId) this.removeUser(data.data.userId)
} else if (data.type == 4) { } else if (data.type === 4) {
this.receiveMessage(data.data) this.receiveMessage(data.data)
} else if (data.type == 5) { } else if (data.type === 5) {
this.removeUser(data.data.userId) this.removeUser(data.data.userId)
this.addUserInfo(data.data) this.addUserInfo(data.data)
} }
@ -198,7 +172,7 @@ export default {
getUSerInfo(userId) { getUSerInfo(userId) {
for (const user of this.asideList) { for (const user of this.asideList) {
if (userId == user.uuid) { if (userId === user.uuid) {
return user.nickName return user.nickName
} }
} }
@ -208,7 +182,7 @@ export default {
let index = null let index = null
for (let i = 0; i < this.asideList; i++) { for (let i = 0; i < this.asideList; i++) {
let item = this.asideList[i] let item = this.asideList[i]
if (userId == item.uuid) { if (userId === item.uuid) {
index = i index = i
break break
} }
@ -225,18 +199,10 @@ export default {
} }
this.asideList.push(user) this.asideList.push(user)
}, },
webSocketSend(data) {
//
// this.webSock.send(JSON.stringify(data))
},
// //
webSocketClose(e) { webSocketClose(e) {
// //
console.log('断开连接', e)
this.user.state = false this.user.state = false
//
this.reconnect()
}, },
reconnect() { reconnect() {
// //
@ -253,75 +219,36 @@ export default {
that.lockReconnect = false that.lockReconnect = false
}, 5000) }, 5000)
}, },
reset() {
//
let that = this
//
clearTimeout(that.timeoutObj)
clearTimeout(that.serverTimeoutObj)
//
that.start()
},
start() {
//
console.log('开启心跳')
this.user.state = true
let self = this
self.timeoutObj && clearTimeout(self.timeoutObj)
self.serverTimeoutObj && clearTimeout(self.serverTimeoutObj)
self.timeoutObj = setTimeout(function () {
//
if (self.ws.readyState == 1) {
//
// self.ws.send("heartCheck"); //
} else {
//
self.reconnect()
}
self.serverTimeoutObj = setTimeout(function () {
//
self.ws.close()
}, self.timeout)
}, self.timeout)
},
//uuid //uuid
selectUser(uuid) { selectUser(uuid) {
console.log(uuid) console.log(uuid)
this.sendUserId = uuid this.sendUserId = uuid
}, },
blurChange() {
this.userChange = false
let data = {
type: 5,
data: this.user.nickName
}
this.webSocketSend(data)
},
/** /**
* 发送消息 * 发送消息
*/ */
sendMsg() { sendMsg() {
if (null == this.sendUserId) {
ElMessage({
showClose: false,
message: '请选择需要发送的用户!',
type: 'error',
})
return
}
// console.log(this.inputValue);
let data = { let data = {
type: 4, id: 1681478908550,
data: { message: this.inputValue,
sendUserId: this.sendUserId, type: "messageUser"
nickName: this.user.nickName,
contactText: this.inputValue
}
} }
this.webSocketSend(data) console.log(data,"data")
axios.get("http://localhost:8000/netty/msg/msg", data).then(res => {
console.log(res)
})
// console.log(this.inputValue);
// let data = {
// type: 4,
// data: {
// sendUserId: this.sendUserId,
// nickName: this.user.nickName,
// contactText: this.inputValue
// }
// }
let msg = { let msg = {
id: this.user.id, id: this.user.id,
headUrl: head, headUrl: head,

View File

@ -9,12 +9,12 @@ spring:
name: gateway name: gateway
profiles: profiles:
# 环境配置 # 环境配置
active: local active: dev
cloud: cloud:
nacos: nacos:
discovery: discovery:
# 服务注册地址 # 服务注册地址
server-addr: 192.168.101.108:8848 server-addr: 119.8.123.240:8848
username: nacos username: nacos
password: nacos password: nacos
namespace: ${spring.profiles.active} namespace: ${spring.profiles.active}

View File

@ -1,5 +1,5 @@
server: server:
port: 8084 port: 8080
# Spring # Spring
@ -11,12 +11,24 @@ spring:
nacos: nacos:
discovery: discovery:
# 服务注册地址 # 服务注册地址
server-addr: 192.168.101.108:8848 server-addr: 119.8.123.240:8848
username: nacos username: nacos
password: nacos password: nacos
namespace: local namespace: dev
redis:
host: 1.14.94.250
password: Hcy@2023
port: 6379
database: 8
rabbitmq:
username: guest
password: guest
addresses: 152.136.148.167
port: 5672
websocket: websocket:
application-name: ${spring.application.name}-ws application-name: ${spring.application.name}-ws
port: 8085 port: 8090