import {showToast} from "vant";
import {lStorage} from "@/utils/storage/index.js";
import {domain} from "@/data/config.js";
export const chatConfig = {
maxLength: 180,
server: domain.chat_server,
path: "/cr"
}
export function isMessageType(command) {
return command == "message" || command == "tips" || command == "image" || command == "file" || command == "confirm";
}
/**
* 处理消息
*/
class ChatClient {
constructor(url, data, handleMessage, handleData) {
this.data = data;
this.url = url;
this.handleMessage = handleMessage;
this.handleData = handleData;
}
connect() {
this.ws = new WebSocket(this.url);
this.ws.onmessage = (event) => {
this.data.enter = true;
this.data.state = "message";
let obj = JSON.parse(event.data);
if (obj.command) {
if (isMessageType(obj.command)) {
this.data.messageList.push(obj);
cacheChatMessage(this.data.roomId, this.data.messageList);
this.handleMessage(obj);
} else if (obj.command == "data") {
this.handleData(obj);
} else {
showToast("消息指令错误,请联系管理员");
}
} else {
showToast("消息格式错误,请联系管理员");
}
}
this.ws.onopen = (event) => {
this.data.enter = true;
this.data.state = "open";
showToast({message: "已连接", duration: 1000});
}
this.ws.onerror = (event) => {
this.data.state = "error";
this.data.enter = false;
showToast({message: "服务暂停", duration: 2000});
console.error(event);
}
this.ws.onclose = (event) => {
this.data.state = "close";
this.data.enter = false;
showToast({message: "连接断开", duration: 2000});
}
}
initMessage() {
this.data.messageList = [];
let cacheList = getCacheChatMessage(this.data.roomId);
if (cacheList && cacheList.length > 0) {
this.data.messageList.push(...cacheList);
}
}
send(message, command) {
if (this.ws.readyState == WebSocket.OPEN) {
this.data.state = "message";
this.data.enter = false;
let messageObj = {
"message": message,
"roomId": this.data.roomId,
"senderId": this.data.senderId,
"command": command
};
this.ws.send(JSON.stringify(messageObj));
if (isMessageType(messageObj.command)) {
this.data.messageList.push(messageObj);
cacheChatMessage(this.data.roomId, this.data.messageList);
}
this.data.enter = true;
} else if (this.ws.readyState == WebSocket.CONNECTING) {
showToast("连接中");
setTimeout(() => {
this.send(message, command);
}, 1000)
} else if (this.ws.readyState == WebSocket.CLOSING || this.ws.readyState == WebSocket.CLOSED) {
showToast("请重连");
this.data.enter = false;
this.data.state = "close";
}
return this.ws.readyState;
}
sendMessage(message) {
return this.send(message, "message");
}
sendImage(message) {
return this.send(message, "image");
}
sendFile(message) {
return this.send(message, "file");
}
sendConfirm(message) {
return this.send(message, "confirm");
}
sendTips(message) {
return this.send(message, "tips");
}
sendData(message) {
return this.send(message, "data");
}
state() {
return this.ws.readyState;
}
}
export const createChatClient = (data, handleMessage, handleData) => {
let url = "ws://" + chatConfig.server + chatConfig.path;
let chatRoomClient = new ChatClient(url, data, handleMessage, handleData);
window["chatRoomClient"] = chatRoomClient;
return chatRoomClient;
}
export const getChatParam = () => {
return lStorage.get("_ref_chat_param");
}
export const setChatParam = (senderId, senderName, roleId, roleName, roomId, roomName, kfId, kfName) => {
lStorage.set("_ref_chat_param", {
"senderId": senderId,
"senderName": senderName,
"roleId": roleId,
"roleName": roleName,
"roomId": roomId,
"roomName": roomName,
"kfId": kfId,
"kfName": kfName,
"time": new Date().getTime()
});
}
export const cacheChatMessage = (roomId, messageList) => {
lStorage.set("_ref_chat_message_list_" + roomId, messageList);
}
export const getCacheChatMessage = (roomId) => {
return lStorage.get("_ref_chat_message_list_" + roomId);
}
export const messageHtml = (html) => {
if (html) {
let content = html.trim();
const p_start = "<p>", p_end = "</p>";
const br_1 = "<br>", br_2 = "<br/>";
while (content.startsWith(p_start) && content.endsWith(p_end)) {
content = content.substring(p_start.length, content.length - p_end.length);
}
while (content.startsWith(br_1)) {
content = content.substring(br_1.length, content.length);
}
while (content.startsWith(br_2)) {
content = content.substring(br_2.length, content.length);
}
while (content.endsWith(br_1)) {
content = content.substring(0, content.length - br_1.length);
}
while (content.endsWith(br_2)) {
content = content.substring(0, content.length - br_2.length);
}
return content;
}
return "";
}
export function initRoomData() {
let chatParam = getChatParam();
if (chatParam && chatParam.roomId && chatParam.senderId) {
let roomData = {...roomDataExample};
roomData.kfId = chatParam.kfId;
roomData.room = {"id": chatParam.roomId};
roomData.actors[chatParam.senderId] = {
id: chatParam.senderId,
name: chatParam.senderName,
nickname: chatParam.roleName + chatParam.senderId,
roleId: chatParam.roleId,
status: "on"
}
return roomData;
}
return null;
}
export const roomDataExample = {
"kfId": "",
"data": null,
"room": {
"id": "",
"name": "",
"actorCount": "",
"relActorName": "",
"adminId": "",
"status": "",
"description": "",
},
"actors": {}
}
js 聊天室代码
于 2025-03-23 22:16:42 首次发布