基于Jeecgboot前后端分离的聊天功能集成(二)
原创
©著作权归作者所有:来自51CTO博客作者宁波阿成的原创作品,请联系作者获取转载授权,否则将追究法律责任
因为本项目不需要electron组件,所以相关这条个组件的内容都先去掉
token是采用jeecgboot机制,所以相关内容也要做调整
因为部门与人员都是用现有的表,所以相应前端内容也要做调整
1、所有userid相关都要修改成username
比如:ChatListUtils部分修改如下:
export const ChatListUtils = {
listKey: "_chatList",
setChatList: function(userName, chatList) {
localStorage.setItem(userName + this.listKey, JSON.stringify(chatList));
},
//从缓存中获取已经保存的会话
getChatList: function(userName) {
let str = localStorage.getItem(userName + this.listKey);
if (!str) {
return [];
}
console.log("getChatList", str);
return JSON.parse(str);
},
2、对于群组与个人chat ,因为id不一样,所以也要做判断处理
比如resetChatList 这个部分修改如下:
resetChatList: function(self, user, host, type) {
console.log("resetChatList user=",user);
console.log("resetChatList self.$store.state.im=",self.$store.state.im);
let chatList = this.getChatList(self.$store.state.im.imuser.username);
// 删除当前用户已经有的会话
let newChatList = chatList.filter(function(element) {
return String(element.id) !== String(user.username);
});
let avatar = user.avatar;
let chat=null;
if (type === "1") { //若是群聊
// 重新添加会话,放到第一个
chat = new Chat(
user.id,
user.name,
avatar,
0,
"",
user.phone,
user.email,
type
);
} else {
// 重新添加会话,放到第一个
chat = new Chat(
user.username,
user.realname,
avatar,
0,
"",
user.phone,
user.email,
type
);
}
console.log("resetChatList chat=",chat);
newChatList.unshift(chat);
console.log("resetChatList newChatList=",newChatList);
// 存储到localStorage 的 chatList
this.setChatList(self.$store.state.im.imuser.username, chatList);
self.$store.commit("setChatList", newChatList);
return chat;
}
3、部门这部分前端修改较少,主要是后端的修改
4、文件上传需要修改成jeecgboot模式
upload-tool文件的下面部分做调整
action: conf.getHostUrl() + "/sys/common/upload",
headers: {
"Access-Control-Allow-Origin": "*",
"X-Access-Token": StoreUtils.getAccessToken(),
}
同时返回信息修改如下
handleSuccess(res, file) {
let self = this;
if (res.success) {
let path = res.message;
let fileName = file.name;
// 文件后缀
let suffix = fileName.substring(
fileName.lastIndexOf(".") + 1,
fileName.length
);