uniapp+websocket聊天功能实现

data() {
	return {
		// socket是否开启
		socketOpen: false,
		// 定时器
		timer: null,
	}
},

onLoad() {
	// socket初始化
	this.init()
	// 定时器，定时判断socket是否掉线
	this.timer = setInterval(() => {
		this.isSocketConnct()
	}, 6000)

},

onUnload() {
	// 关闭定时器
	clearInterval(this.timer)
	// 关闭Socket
	this.closeSocket()
},

methods: {
    // 接收到事件后处理的方法（可自己重写）
	onMessageHandle(obj) {
		// 根据自己业务逻辑重写
	},
	// 发送消息后处理的方法（可自己重写）
	sendMessageHandle(msg) {
		// 根据自己业务逻辑重写
	},
	// 发送消息方法
	send(value) {
		// 自定义消息体
		let param = {
			"code": 2,
			"body": value,
		}
		let msg = JSON.stringify(param)
		this.sendSocketMessage(msg)
	},
	// 发送消息
	sendSocketMessage(msg) {
		console.log("发送消息", msg);
		let that = this
		if (that.socketOpen) {
			uni.sendSocketMessage({
				data: msg,
				success: (res) => {
					console.log(res);
					setTimeout(() => {
						// json转对象
						let param = JSON.parse(msg)
						that.sendMessageHandle(param)
					}, 300)
				},
				fail(err) {
					console.log(err);
					// 发送失败处理
				}
			});
		} else {
			// Socket没有开启，重新连接并重新发送消息
			this.init()
			setTimeout(() => {
				this.sendSocketMessage(msg)
			}, 300)
		}
	},
	// 判断是否连接
	isSocketConnct() {
		if (!this.socketOpen) {
			console.log("WebSocket 再次连接！");
			this.init()
		}
	},

	// 初始化
	init() {
		this.connect()
		this.openSocket()
		this.onclose()
		this.onSocketMessage()
	},
	// 建立连接
	connect() {
		let token = getToken()
		uni.connectSocket({
			// 参数需要使用encodeURIComponent转码一下，不然onOpen可能监听不到的情况，原因是token中可能有空格，没有处理。
			url: `${WEBSOCKET_URL}/web/ws?token=${encodeURIComponent(token)}`,
			success(res) {
				console.log('连接成功', res);
			},
			fail(err) {
				console.log('连接失败', err);
			}
		});
	},
	// 打开Soceket
	openSocket() {
		let that = this
		uni.onSocketOpen((res) => {
			that.socketOpen = true
			console.log('WebSocket连接已打开!', res);
		});
	},
	// 监听关闭
	onclose() {
		let that = this
		uni.onSocketClose((res) => {
			that.socketOpen = false
			console.log('WebSocket 已关闭!', res);
		});
	},
	// 接收事件
	onSocketMessage() {
		let that = this
		uni.onSocketMessage((res) => {
			let obj = JSON.parse(res.data)
			console.log("接收事件", obj);
			this.onMessageHandle(obj)
		});
	},
	// 关闭
	closeSocket() {
		uni.closeSocket();
	},
}